·网页特效库   ·网页工具库      
网页特效库
   
背景按钮导航特效图片特效文本特效时间特效状态特效另类特效网页制作网站首页
 
< 后退    |    收藏网页特效库
 推荐网页特效 更多推荐特效
 购物网站的导航效果,推荐!
 向上下左右滚动图片的特效
 超级变态广告代码
 设为首页
  加入收藏夹
 防止选择和复制
 新浪博客的提示窗口,推荐!
网页工具库 - 让网页制作更轻松
 推荐网页工具 更多网页工具
 在线html编辑器
 在线CSS编辑器
 滚动条颜色生成器
 弹出窗口生成器
 网页加密解密工具
 汉字转换成拼音工具
 文本繁简体转换工具
您的位置:网页特效库 >>  网页制作 >>  Javascript操作表单域两个重要技巧 打印友好页面
Javascript 操作表单域的两个重要技巧
作者:shawl.qiu   出处:csdn

说明: 
技巧一:
当表单提交或重置时向客户端进行确认操作

技巧二: 
列出表单域中所有元素及其重要属性, 就是 input, select 等的 name, value 等.

总结:
用这两个技巧可以写一个通用的客户端表单验证函数, 至于怎么写, 动动脑筋就行了^^.
但是鄙人还是觉得, 不能过于依赖客户端的验证机制, 现在的人聪明得很, 只要花一点小心思, 就可以避过客户端的一切限制, 鄙人就乐于此道. 

目录:
1. 当表单提交或重置时向客户端进行确认操作
2. 列出表单域中所有元素及其重要属性


目录:
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" /> 
</form><br /> 
<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; i<obj.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</a><p/>  
<form name="fm" id="fm" method="post" action="">  
      <input name="textfield" type="text" value="tbx value" /><br />  
    <input type="radio" name="RadioGroup1" value="radio" />Radio<br />  
    <input type="radio" name="RadioGroup1" value="radio" />Radio<br />  
    <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>  
    </select><br />  
    <select name="sle1" size="2" multiple id="sle1">  
      <option value="v">sle</option>  
      <option value="v1">sle1</option>  
      </select><br />  
    <textarea name="textarea">txa value</textarea><br />  
    <input type="submit" value="Submit" />  
    <input type="reset" value="Reset" />  
</form>
 上一篇:WEB开发者需要了解的IE7新功能 返回列表  下一篇:css小技巧---改善你的输入体验
网页工具库 - 让网页制作更轻松
 
网页特效库 关于我们 | 联系本站 | 免责声明 | 版权声明 | 网站地图 | 友情链接 | 鄂ICP备05023174号
Copyright © 2008 www.butong.net.All Rights Reserved.