Jquery 仅当填写了所有必填字段时，如何更改按钮的值？

仅当表单中填写了所有必填字段时，如何更改按钮的值

脚本

$('#myButton').click(function(){
    $(this).val('We are logging you in...');
});

表格

<form method='post' action="dashboard.php" id="login">
    <input id="username" type="email" name="userName" placeholder="Email address">            
    <input id="password" type="password" name="password" placeholder="Password">
</form>

<input type="submit" id="myButton" name='logIn' class="button" value="Login">

这是我可以做的小提琴：

如何使用jQuery实现这一目标？

试试

$('#myButton').click(function(){
    var cache = $('input:not([type="submit"])');
    var condition = cache.filter(function(){ return $(this).val() !== ""; }).length === cache.length;
    if(condition){ $(this).val('We are logging you in...'); }
    else { $(this).val('We are not gonna log you in...'); }
});

试试这个：

 $('#myButton').click(function(){
var allValidated = true;
$('#login input').each(function(){
if($(this).val()=="")
      allValidated = false;
})
if(allValidated)
  $(this).val('We are logging you in...');
}); 

使用了您的小提琴代码： 假设您使用电子邮件作为第一个输入

$('#myButton').click(function(){
    var email = $("#username").val();
    var password = $("#password").val();
    if(validateEmail(email) && password!= ''){
     $(this).val('We are logging you in...');
    } else {
      //Your error msg here
      return false;
    }

});

function validateEmail(email){
    var emailReg = new RegExp(/^(("[\w-\s]+")|([\w-]+(?:\.[\w-]+)*)|("[\w-\s]+")([\w-]+(?:\.[\w-]+)*))(@((?:[\w-]+\.)*\w[\w-]{0,66})\.([a-z]{2,6}(?:\.[a-z]{2})?)$)|(@\[?((25[0-5]\.|2[0-4][0-9]\.|1[0-9]{2}\.|[0-9]{1,2}\.))((25[0-5]|2[0-4][0-9]|1[0-9]{2}|[0-9]{1,2})\.){2}(25[0-5]|2[0-4][0-9]|1[0-9]{2}|[0-9]{1,2})\]?$)/i);
    var valid = emailReg.test(email);

    if(!valid) {
        return false;
    } else {
        return true;
    }
}

---

您可以使用事件处理程序执行此操作

1） 收集除sumit按钮之外的所有文本框字段

var allInps = $('input').not('input[type="submit"]');

2） 现在连接模糊事件处理程序以执行以下操作

3） 创建一个

boolean

变量（

ch

），以检查是否已填充所有必填字段，然后迭代每个

textbox

元素，检查其值的长度，并根据它更改

boolean

变量（

ch

）的值

allInps.on('blur', function () {
    var ch = false;
    $.each(allInps, function (i, v) {
        if ($(v).val().length !== 0) 
            ch = true;
        else 
            ch = false;
    });
    if (ch)  
       $('#myButton').val('NOW U CAN LOGIN');
});