基于选择文本的Jquery条件验证

我想只在“select1”字段中的选定文本是“其他”我想要的规则是：other: { required: function(element){ return $("#select1 option:selected").text() == "Other"; } }我做错了什么？下面的代码：基于选择文本的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> 
    $(document).ready(function(){ 
    $('form:first').validate({ 
     rules: { 
      cname: { 
      required: true, 
     }, 
     select1: { valueNotEquals: "0" } 
     }, 
     other: { 
       required: function(element){ 
          return $("#select1 option:selected").text() == "Other"; 
         } 
     }, 
     messages: { 
      cname: "Please enter a valid naaaammmeeee.", 
     select1: "Please choose a valid option", 
     other: "Please enter a valid other value", 
     }, 
     }); 

     $.validator.addMethod("valueNotEquals", function(value, element, arg){ 
     return arg != value; 
     }, "Value must not equal arg."); 
    }); 
    </script> 

</head> 
<body> 


<form class="cmxform" id="commentForm" method="get" action=""> 
<fieldset> 
    <legend>A simple comment form with submit validation and default messages</legend> 
    <p> 
    <label for="cname">Name</label> 
    <em>*</em><input id="cname" name="cname"/> 
    </p> 
    <p> 
    <select name="select1" id="select1"> 
    <option value="0">Please choose a value</option> 
    <option value="1">1</option> 
    <option value="2">2</option> 
    <option value="3">Other</option> 
    </select> 
    </p> 
    <p> 
    <label for="other">Other</label> 
     <em>*</em><input id="other" name="other"/> 
    </p> 
     <p> 
     <input class="submit" type="submit" value="Submit"/> 
     </p> 
</fieldset> 
</form> 
</body> 
</html>

来源

2012-12-18 nelsie

你想在这里实现准确呢？你能更具体吗？ – Amar

有大多与JSON格式的多个问题：

一个额外closing bracket这里：

select1: { valueNotEquals: "0" } 
    },

一个closing bracket缺少rules定义的末尾和messages定义

返回$（“＃select1 option：selected”）。 }} }，
消息：{
额外在每个选项结束comma分别在validate.js路径非必要
空间（这可能是这里的错字问题itslef）

这里是更正后的代码：

...

<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> 
     $(document).ready(function(){ 
    $('form:first').validate({ 
    rules: { 
     cname: { required: true }, 
     select1: { valueNotEquals: "0" }, 
     other: { required: function(element){ 
          return $("#select1 option:selected").text() == "Other"; 
          } 
      } 
}, 
     messages: { 
      cname: "Please enter a valid naaaammmeeee.", 
      select1: "Please choose a valid option", 
      other: { required: "Please enter a valid other value"} 
      } 
}); 
...

来源

2012-12-18 18:44:38 Amar

谢谢阿马尔。这很有用。我对JQuery相对来说比较新，并且还没有掌握所有的语法规则。非常感谢您的帮助。 – nelsie

欢呼声:)现在，如果您对答案感到满意，现在您应该接受答案，并且在将来也会习惯这样做。我在说一般:) – Amar

对不起Amar，虽然验证现在正在工作，我的消息被忽略，并且默认的“此字段是必需的”即将通过。这里还有其他的东西吗？ – nelsie

$('select').change(function() { 
    var text = $('select option:selected').text(); 
    if(text == 'Other') { 
     $('input[name=other]').attr('disabled', false);   
    } 
    });

这是你的意思

来源

2012-12-18 18:19:15 ashley

道歉，如果描述不清楚。我想打只需要如果在“选择1”字段选择的文本是“其他”中的“其他”栏我想规则是：其他：{ 要求：功能（元素）{ \t \t \t \t \t \t \t return $（“＃select1 option：selected”）。text（）==“Other”; \t \t \t \t \t \t \t}} ， – nelsie

我已经改变了我的答案。检查这看到：http://jsfiddle.net/7QJpr/ – ashley

谢谢阿什利。现在正在工作。 – nelsie

您可以删除选项，其中包含“0”的数值。

<option>Select here someting</option>

当一个选项不包含值atrribute时，比jQuery validate将其处理为空或未给出。

<select class="required"><option>Select here someting</option></select>

您可以为类添加“要求”你的选择框，以便jQuery验证将PROMT“必要”的警告。

来源

2012-12-18 18:29:49

更新了答案，在小提琴在这里找到一个演示：http://jsfiddle.net/3jrTM/

$('form:first').validate({ 
rules: { 
    cname: { 
     required: true 
    }, 
    select1: { 
     valueNotEquals: "0" 
    }, 
    other: { 
     required: function(element) { 
      return $("#select1 option:selected").text() == "Other"; 
     } 
    }, 
}, 
messages: { 
    cname: "Please enter a valid naaaammmeeee.", 
    select1: "Please choose a valid option", 
    other: "Please enter a valid other value" 
} 

}); 

$.validator.addMethod("valueNotEquals", function(value, element, arg) { 
return arg != value; 
}, "Value must not equal arg.");

来源

2012-12-18 18:31:21 Jai

谢谢Jai。这部分工作。以下规则会给我带来问题。 – nelsie

@nelsie查看上面更新的答案和小提琴链接。 – Jai

oops downvote。刚更新了答案。 – Jai

基于选择文本的Jquery条件验证

回答

相关问题