2012-04-12 54 views
0

我正在查看jQuery文档中的以下源代码。你可以看到它说:field:我将它设置为特定领域这样field:('#fieldname');jQuery:使用验证查询

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" 
        "http://www.w3.org/TR/html4/loose.dtd"> 
<html> 
<head> 
    <script src="http://code.jquery.com/jquery-latest.js"></script> 
    <script type="text/javascript" src="http://jzaefferer.github.com/jquery-validation/jquery.validate.js"></script> 
<script type="text/javascript"> 
jQuery.validator.setDefaults({ 
    debug: true, 
    success: "valid" 
});; 
</script> 

    <script> 
    $(document).ready(function(){ 
    $("#myform").validate({ 
    rules: { 
    field: { 
     required: true, 
     url: true 
    } 
    } 
}); 
    }); 
    </script> 
    <style>#field { margin-left: .5em; float: left; } 
    #field, label { float: left; font-family: Arial, Helvetica, sans-serif; font-size: small; } 
    br { clear: both; } 
    input { border: 1px solid black; margin-bottom: .5em; } 
    input.error { border: 1px solid red; } 
    label.error { 
     background: url('http://dev.jquery.com/view/trunk/plugins/validate/demo/images/unchecked.gif') no-repeat; 
     padding-left: 16px; 
     margin-left: .3em; 
    } 
    label.valid { 
     background: url('http://dev.jquery.com/view/trunk/plugins/validate/demo/images/checked.gif') no-repeat; 
     display: block; 
     width: 16px; 
     height: 16px; 
    } 
</style> 
</head> 
<body> 

<form id="myform"> 
    <label for="field">Required, URL: </label> 
    <input class="left" id="field" name="field" /> 
    <br/> 
    <input type="submit" value="Validate!" /> 
</form> 

</body> 
</html> 
+0

从该演示在http://jquery.bassistance.de/validate/demo/源,它看起来像你刚才设置'字段:''到whateverthefieldnameis:' – aupdo 2012-04-12 19:24:50

回答

1

领域是要验证页面元素的名称的引用。在你的情况,您要验证的页面元素的名称叫做“场”:

<input class="left" id="field" name="field" /> 

如果它有一个不同的名字,那么你会在你的代码中使用该名称。

例如,如果你有另外的表单字段名为FIRST_NAME:

<input class="left" id="first_name" name="first_name" /> 

jQuery的代码来验证这两个“场”和“FIRST_NAME”文本框会是这样:

<script> 
    $(document).ready(function(){ 
    $("#myform").validate({ 
     rules: { 
     field: { 
     required: true, 
     url: true 
     }, 
     first_name: { 
     required: true 
     } 
    } 
    }); 
    }); 
</script> 
+0

反正我有可以检查其工作? – 2012-04-12 21:54:43

+0

您应该可以通过在网络浏览器中打开表单来测试表单,然后将表单留空并点击提交按钮。您会在字段旁边看到一条显示“此字段为必填字段”的消息。我已将您的代码复制并粘贴到新文件中。将该字段留空并点击提交:http://jsbin.com/omimit – 2012-04-12 23:24:39