使用jQuery输入表单验证

Question

我试图验证表单，但没有标签，所有消息都在同一个输入中。

我有我想要的HTML工作，但与jQuery我有elseif和其他问题。

我想说：
- 如果输入名字仍然命名给该邮件名称丢失（这似乎工作）
- 如果输入地址仍是解决给邮件地址丢失（它不工作）
- 如果输入地址和输入名称没有地址或名称提交表单（它不工作）

我这里的例子：http://jsfiddle.net/4ervc/20/

HTML：

<form id="form" action="#"> 
    <input type="text" name="name" id="name" value="name" 
    onfocus="if (this.value=='name'||'name is missing') this.value = '';" 
    onblur="if (this.value=='') this.value = 'name';" /> 
    <br /> 

    <input type="text" name="address" id="address" value="address" 
    onfocus="if (this.value=='address'||'address is missing') this.value = '';" 
    onblur="if (this.value=='') this.value = 'address';" /> 
    <br /> 

    <input type="submit" name="submit" id="submit"> 
</form> 

JQUERY：

$(function(){ 

    $("#form").submit(function (e) { 

     if ($('#name').val("name")) { 
      e.preventDefault(); 
      $('#name').val("name is missing"); 
     }else if ($('#address').val("address")) { 
      e.preventDefault(); 
      $('#address').val("address is missing"); 
     }else{ 
      $("#form").submit; 
     } 

    }); 

}) 

Answer 1

个

与原代码的几个问题：

1. 您提交的呼叫$("#form").submit;是不正确的，应该是$("#form").submit();
2. 因为你正在使用IF-ELSEIF逻辑，您的验证只是验证地址字段如果名称字段是正确的。它应该每次验证所有字段。
3. 你应该使用$('#name').val() === 'name'，不$('#name').val('name')

下面通过一个简单的标志，并分别检查各个领域解决这些事情比较字段值。提交电话也是固定的。此外http://jsfiddle.net/4ervc/21/

$(function() { 

    $("#form").submit(function(e) { 

     //assume valid form 
     var valid = true; 
     if ($('#name').val() === 'name') { 
      e.preventDefault(); 
      $('#name').val('name is missing'); 
      valid = false; 
     } 

     if ($('#address').val() === 'address') { 
      e.preventDefault(); 
      $('#address').val('address is missing'); 
      valid = false; 
     } 

     if (valid) { 
      $('#form').submit(); 
     } 

    }); 
}); 

- 只是一张纸条上的代码味道 - 你应该尝试一直贯穿脚本，以使用单个或双引号：

试试这个。你已经使用了一些不理想的（但将工作）。

Answer 2

您设置一个值 “名”

尝试使用此：

$（ '＃名称'）VAL（）==。 “name”

你内部如果陈述