首页 诗词 字典 板报 句子 名言 友答 励志 学校 网站地图
当前位置: 首页 > 教程频道 > 网站开发 > Web前端 >

jquery中限制一部分字段不能输入

2012-09-20 
jquery中限制部分字段不能输入在一个比如表单验证的过程中,有时候,假如要用户一定要输入某个字段,否则不给

jquery中限制部分字段不能输入
  在一个比如表单验证的过程中,有时候,假如要用户一定要输入某个字段,否则不给输入
其他字段,即屏蔽其他字段的输入,这个时候依然可以用jquery可以做到,例子如下:

1 假如页面有三个字段,用户名和密码和密码确认三个字段:
 

  <form>
<div>
<span name="username"/>
<span name="password" />
<span name="confpass" />
<span name="code">$(document).ready(function() {$('.error').hide();$('.username').blur(function(){data=$('.username').val();var len=data.length;if(len<1){$('.username').next().show();$('.password').attr('disabled',true);$('.confpass').attr('disabled',true);}else{$('.username').next().hide();$('.password').removeAttr('disabled');$('.confpass').removeAttr('disabled');}});$('.password').blur(function(){data=$('.password').val();var len=data.length;if(len<1){$('.password').next().show();$('.confpass').attr('disabled',true);}else{$('.password').next().hide();$('.confpass').removeAttr('disabled');}});$('.confpass').blur(function(){if($('.password').val() !=$('.confpass').val()){$('.confpass').next().show();}else{$('.confpass').next().hide();}});});
   
原理其实很简单,比如这里,在每个文本框的onblur事件中进行判断,先看用户框
中的是否输入和长度是否匹配,如果不符合要求的话,则$('.username').next().show();
这句,其实是显示下一个元素(即出错信息提示,即<span class="error"> User name cannot be blank</span>
)
  并且同时$('.password').attr('disabled',true);
$('.confpass').attr('disabled',true);
   将其他字段的disabled属性设置为TRUE即可.
   当然,要是输入了的话,也要重新设置回来,道理就这么简单了 1 楼 xuedong 2011-08-14   不错,转了

热点排行