Question

我想根据文本框的javascript结果禁用该按钮，如果有错误的电子邮件ID，则应禁用该按钮。请帮助我。如果有错误的电子邮件和电话号码，我想禁用我的按钮功能或者按钮。我的问题是我在文本框中使用单独的javascript函数，所以如何根据其他javascript函数禁用按钮。帮我解决这个问题

<div align="right">
</div>
<div id="div">
<center> <h3>REGISTER</h3></center>
<div id="output" align="center">
</div>
<table>
<thead>
</thead>
<tbody>
<tr>
<td>
<label>Firstname</label>
<td>
<input type="text" name="firstname" id="firstname" required=""> 
</td>
</tr>
<tr>
<td>
<label>Lastname</label>
</td>
<td>
<input type="text" name="lastname" id="lastname"  required="">
</td>
</tr>
<tr>
<td>
<label>Email</label>
</td>
<td>
<input type="text" name="email" id="email" required="">
</td>
<td id="error" style="display:none;color:red">
invalidemail
</td>
</tr>
<tr>
<td>
<label>Password</label>
</td>
<td>
<input type="password" name="password" id="password" required="">
</td>
</tr>
<tr>
<td>
<label>Confirm password</label>
</td>
<td>
<input type="password" name="confirmpassword" id="confirmpassword" required="">
</td>
<span id="pass"></span>
</tr>
<tr>
<td>
<label>Phone no</label>
</td>
<td>
<input type="text" name="phoneno" pattern="[789][0-9]{9}" id="phoneno" required="" maxlength="10">
</td>
<td id="invalidphone" style="display:none;color:red">
invalidphoneno
</td>

</tr>
<tr>
<td>
</td>
<td>
<input type="submit" name="submit" value="submit" id="submit"/>
</td>
</tr>
<tr>
<td>
</td>
<td>
</td>
<td>
<a href="login.php">Login?</a>
</td>
</tr>
</tbody>
</table>
</div>
</body>
</head>
</html>
<script type="text/javascript">
$('#email').on('keypress', function() {
    var re = /([A-Z0-9a-z_-][^@])+?@[^$#<>?]+?\.[\w]{2,4}/.test(this.value);
    if(!re) {
        $('#error').show();
    } else {
        $('#error').hide();
    }
});
$('#phoneno').on('keypress',function(){
  var phone=/^\+{0,2}([\-\. ])?(\(?\d{0,3}\))?([\-\. ])?\(?\d{0,3}\)?([\-\. ])?\d{3}([\-\. ])?\d{4}/.test(this.value);
  if(!phone){
    $('#invalidphone').show();
  }
  else
  {

    $('#invalidphone').hide();
  }
  });
$(document).ready(function(){
$('#submit').click(function(){
var first=$('#firstname').val();
var last=$('#lastname').val();
var Email=$('#email').val();
var pass=$('#password').val();
var confirm=$('#confirmpassword').val();
var phone=$('#phoneno').val();


$.ajax({
     type:"POST",
     url:"register.php",
     data:{

       firstname:first,
        lastname:last,
        email:Email,
        password:pass,
        confirmpassword:confirm,
        phoneno:phone,

       },
      success:function(data){
        if($.trim(data)==='successfully registered')
        {
        $('#output').html(data);
        }
        else
        {
        $('#pass').html(data);
        }
      },
      error:function()
      {
        alert("error");
      }

});
});
});

</script>

Answer 1

最初禁用提交按钮，直到您拥有所有表格元素正确
使用HTML5输入（电子邮件和文本）字段，您已经拥有必需的属性，但需要输入required =＆＃34; required＆＃34;
为最后一个（必填）字段设置onChange事件，检查是否为验证成功。

查看此内容以获取更多详细信息和其他信息 If input field is empty, disable submit button

Answer 2

使用$("#submit").attr("disabled", true);停用，$("#submit").removeAttr("disabled");启用按钮

$('#phoneno').on('keypress',function(){
  var phone=/^\+{0,2}([\-\. ])?(\(?\d{0,3}\))?([\-\. ])?\(?\d{0,3}\)?([\-\. ])?\d{3}([\-\. ])?\d{4}/.test(this.value);
  if(!phone){
    $("#submit").attr("disabled", true);  // disable submit btn
    $('#invalidphone').show();
  }
  else
  {
    $("#submit").removeAttr("disabled");  //enable submit btn
    $('#invalidphone').hide();
  }
  });

Answer 3

只需停用javascript顶部的按钮。

$("#submit").prop("disabled", true);

然后在你的正则表达式中，如果是，则将其设置为false。

编辑 - 最好将你的正则表达式变量设置为全局，然后你可以为两个正则表达式执行if语句。

if (re && phone) {
    $("#submit").prop("disabled", false);
}

如何根据javascript函数的结果禁用按钮

3 个答案: