想不想get新技能酷炫一下,今天图老师小编就跟大家分享个简单的Javascript 操作表单域的两个重要技巧教程,一起来看看吧!超容易上手~
【 tulaoshi.com - Web开发 】
说明:
技巧一:
当表单提交或重置时向客户端进行确认操作
技巧二:
列出表单域中所有元素及其重要属性, 就是 input, select 等的 name, value 等.
总结:
  用这两个技巧可以写一个通用的客户端表单验证函数, 至于怎么写, 动动脑筋就行了^^.
但是鄙人还是觉得, 不能过于依赖客户端的验证机制, 现在的人聪明得很, 只要花一点小心思, 就可以避过客户端的一切限制, 鄙人就乐于此道. 
目录:
(本文来源于图老师网站,更多请访问http://www.tulaoshi.com/webkaifa/)  1. 当表单提交或重置时向客户端进行确认操作
  2. 列出表单域中所有元素及其重要属性
目录:
(本文来源于图老师网站,更多请访问http://www.tulaoshi.com/webkaifa/)1. 当表单提交或重置时向客户端进行确认操作
以下是引用片段:
meta http-equiv="Content-Type" content="text/html; charset=utf-8" /  
script type="text/javascript"  
//![CDATA[  
    function fCfm(msg){  
        if(confirm(msg))return true;  
        return false;  
    } // shawl.qiu script  
//]]  
/script  
form name="form1" id="form1" method="get" action=""  
    onsubmit="return fCfm('现在提交数据吗?');"  
     onreset="return fCfm('现在重置表单域所有内容吗?');"   
      
  input name="textfield" type="text" value="tbx default value" /  
  br /  
  textarea name="textarea"txa default value/textarea  
  br /  
  input type="submit" name="Submit" value="Submit" /  
  input type="reset" name="Reset" value="Reset" /  
/formbr /  
a href="?"back/a 
2. 列出表单域中所有元素及其重要属性
  以下是引用片段:
script type="text/javascript"   
//![CDATA[   
    function fListFmEle(obj){   
        try{ w.close(); } catch(e){}   
           
        w=open('', 'popup', 'width=500, height=500, left=200, top=100, scrollbars')   
        w.document.write('meta http-equiv="Content-Type" content="text/html; charset=utf-8" /');   
    
        for(var i=0; iobj.length; i++){   
            w.document.write('obj name: ',obj[i].name.fontcolor('red'),   
            'br/obj type: ',obj[i].type.fontcolor('red'),   
            'br/obj.value: ', obj[i].value.fontcolor('blue'),   
            'p/');   
        }   
           
        w.document.onclick=function(){ w.close(); }   
        w.focus();   
    } // shawl.qiu script   
//]]   
/script   
a href="#" onclick="fListFmEle(document.fm);"list form elements/ap/   
form name="fm" id="fm" method="post" action=""   
      input name="textfield" type="text" value="tbx value" /br /   
    input type="radio" name="RadioGroup1" value="radio" /Radiobr /   
    input type="radio" name="RadioGroup1" value="radio" /Radiobr /   
    input name="cbx" type="checkbox" id="cbx" value="checkbox" /   
    input name="cbx1" type="checkbox" id="cbx1" value="checkbox" /   
    input name="cbx2" type="checkbox" id="cbx2" value="checkbox" /br /   
    select name="select"   
      option value="v"opt/option   
      option value="v1"opt1/option   
    /selectbr /   
    select name="sle1" size="2" multiple id="sle1"   
      option value="v"sle/option   
      option value="v1"sle1/option   
      /selectbr /   
    textarea name="textarea"txa value/textareabr /   
    input type="submit" value="Submit" /   
    input type="reset" value="Reset" /   
/form 
来源:http://www.tulaoshi.com/n/20160219/1628081.html
看过《Javascript 操作表单域的两个重要技巧》的人还看了以下文章 更多>>