JavaScript中的验证：单击按钮时为空文本框

Question

我需要使用 JavaScript 验证我的文本框，到目前为止我做了这个：

$(document).ready(function(){
$('#search_form').validate({
rules: {
 searchText:{
     required: true,    
     number: true
            },
  },
 messages: {

     searchText: {
      required: "required",
      number: "must be a number"
     }}
      })}
    );

它工作正常，但如果用户按下搜索按钮而不输入任何值，我还需要显示一条消息，当然文本框包含消息“请输入您的号码”（使用占位符）。

搜索表格：

<form method="get" id="search_form">
<input type="button" value="search" id="search" />
<input type="text"  name="searchText" id="searchText" placeholder="please enter your number"    />
</form> 

当前代码不显示任何内容如果用户在不插入数字的情况下按下搜索按钮，但如果他插入字母，例如，他将收到消息“必须是数字”，如果他删除任何值在文本框中，他会得到“需要”的消息。

我试过了：

searchText:{
     required: {  depends: function()
        { return $( "#searchText" ).val() == 'please enter your number '} },    
     number: true
        },

但没有任何变化。

我希望我能很好地解释我的问题。

---

谢谢！

你是对的，如果我删除文本框中的任何值，我会得到所需的 msg。 但由于我在表单上进行了验证，它没有响应按钮计时。 我如何也可以在按钮上添加验证？

Answer 1

请记住，您的字符串比较是精确搜索。看起来您在尝试的代码中在“数字”一词之后有一个额外的空格。尝试删除该空间并再次测试。如果文本字段的值与占位符值完全匹配，那么您的 depends 方法应该返回 true。或者，您可以尝试$.trim() 以确保删除字符串开头和结尾的空格。

您可以考虑的另一种方法是实例化一个“原始值”属性（使用 jQuery 的 data 方法），这样如果您的占位符值发生变化，您就不需要更新您的 JavaScript 验证代码。