jquery中的动态验证?

时间:2010-05-26 16:37:04

标签: jquery

$(document).ready(function(){
 $('a[rel=addhint]').click(function(){
  var html='<div><label>Hint</label>';
  html+='<span class="input"><input type="text" size="30" class="text" name="hint"/><a href="#" rel="delhint">delete</a></span><br class="clear" /></div>';
  $('div#hintTextContainer').append(html);
  bindDelHintAll();
  return false;
 });

我希望当新文本区域包含必填字段的变种时,最大长度也适用于它。

2 个答案:

答案 0 :(得分:1)

从代码的外观来看,您在页面视图的持续时间内动态构建表单。为了即时实现表单验证系统,您需要创建输入的函数来插入表单验证系统。

一种解决方案是在字段中添加一个属性,该属性将由验证函数读取。

<form name="testform" id="testform" method="post">
  <input type="text" name="hint" validation-params='{ "req" : true, "max-length" : 10 }'>
  <input type="submit">
</form>

<script>
  $(function() {
    $("#testform").submit(function() {
      var self = $(this);
      self.find("input").each(function() {
        var validation = jQuery.parseJSON($(this).attr("validation-params"));
        if (validation.req) { alert("required"); }
      }); 
      return false;
    });
  });
</script>

如果您查看上面的示例,您会看到它创建了一个表单。在提交处理程序中,它接受表单并循环遍历表单上的每个输入,并获取validation-params属性并将字符串属性转换为JSON对象。然后检查特定字段,您可以轻松地在其中添加自己的验证。

答案 1 :(得分:0)

不确定您是否熟悉jQuery验证插件 http://docs.jquery.com/Plugins/Validation

这是一个非常强大的图书馆,各种各样的好东西。你提出的例子可能有点过分。它没有太多关于动态添加的内容,但你可以调整框架来做你想要的。

除此之外。还有一个非常棒的textarea maxlength插件,所以你甚至不需要验证它! http://sigswitch.com/2010/04/updated-textarea-maxlength-with-jquery-plugin/

只要确保用户在文本区域中有内容,只需检查

即可
jQuery('textarea.newlyAdded').val().lenght > 0  

提交时。