jquery验证：自定义验证规则

我希望此表单仅在用户选择“Sí”作为select的问题答案时才需要该字段为“Nombre”。另外，如果用户选择“Sí”，则应该提供电子邮件或电话（在teléfono中）。jquery验证：自定义验证规则

我正在使用验证插件，但没有找到类似规则已被编码的文档。我如何编码？

看着the documentation，我想我需要代码，通过使用required(dependency-expression)或required(dependency-callback)的方法，但我没有这或如何，点击自己的文档出现缺失的方法=/

<html> 
<head> 

<style type="text/css"> 

label { width: 10em; float: left; } 
label.error { float: none; color: red; padding-left: .5em; vertical-align: top; } 
p { clear: both; } 

em { font-weight: bold; padding-right: 1em; vertical-align: top; } 
</style> 



    <script src="http://code.jquery.com/jquery-latest.js"></script> 
    <script type="text/javascript" src="http://dev.jquery.com/view/trunk/plugins/validate/jquery.validate.js"></script> 

    <link rel="stylesheet" type="text/css" media="screen" href="mistylesheet.css" /> 
<script> 
    $(document).ready(function(){ 
    $("#commentForm2").validate(); 
    }); 


    </script> 

</head> 
<body> 
<form id="commentForm2"> 

    <center><table class="layouttable"> 

     <tr class='row1'><td> <b>&#191;Recomendar&iacute;a nuestros servicios a otra empresa o persona? </b></td></tr> 
     <tr class='row2'><td> 



     <select id = "recomiendaONo" name="recomiendaONo" class="required"> 
      <option value="">Seleccione su respuesta</option> 
      <option value="Si">S&iacute;</option> 
     <option value="No">No</option> 

     </select> 



     </td></tr> 


    </table></center>  






<div class='margenrecomendaciones'> 
<table> 

<tbody> 


<tr> 



<td><div align="left">Nombre:</div></td> 

<td><div align="left"><input class="texto" id="nombreRecomendado" name="nombreRecomendado" type="text" size="30"/></div></td> 

</tr>  




<td><div align="left">Email:</div></td> 

<td><div align="left"> <input class="texto" id="emailRecomendado" name="emailRecomendado" type="text" size="30"/></div></td> 




</tr> 

<tr> 



<td><div align="left">Tel&eacute;fono:</div></td> 

<td><div align="left"> <input class=" texto" name="telefonoRecomendado" id="telefonoRecomendado" type="text" size="30"/></div></td> 




</tr> 


</tbody> 

</table> 
</div> 


    <center><input type="submit"></center> 


</form> 
</body> 
</html>

来源

2010-09-09 andandandand

时，因为

你可以看看他们的演示页面，看看硬编码的例子如何使这项工作。如果未选择选择项，并且选择了选择项，则只会禁用javascript字段，禁用的属性将被删除。

从演示站点复制粘贴：

//code to hide topic selection, disable for demo 
var newsletter = $("#newsletter"); 
// newsletter topics are optional, hide at first 
var inital = newsletter.is(":checked"); 
var topics = $("#newsletter_topics")[inital ? "removeClass" : "addClass"]("gray"); 
var topicInputs = topics.find("input").attr("disabled", !inital); 
// show when newsletter is checked 
newsletter.click(function() { 
    topics[this.checked ? "removeClass" : "addClass"]("gray"); 
    topicInputs.attr("disabled", !this.checked); 
});

http://jquery.bassistance.de/validate/demo/

来源

2010-09-09 18:45:49 newbie

谢谢，但这不是我要找的。 – andandandand 2010-09-09 20:25:59

您需要创建自己的自定义规则，这个类添加到您的这两个字段。

在你的js文件：

jQuery.validator.addMethod("newRuleOr", function(value, element) { 
     if($('#recomiendaONo').val() == 'Si'){ 
      return $('#emailRecomendado').val() != '' && $('#telefonoRecomendado').val(); 
     } 
     return true; 
    }, "Telefono o mail deben informarse." 
);

而在你的HTML代码，你必须将添加新的类的字段。

<input class="texto newRuleOr" id="nombreRecomendado" name="nombreRecomendado" type="text" size="30"/> 
... 
<input class="texto newRuleOr" id="emailRecomendado" name="emailRecomendado" type="text" size="30"/>

另一个提示，从不使用表格来设计你的页面，使用divs，float和百分比。

来源

2016-03-04 13:45:01 cralfaro

jquery验证：自定义验证规则

回答

相关问题