как отключить кнопку на основе результата функции JavaScript

1

Я хочу отключить кнопку на основе результата javascript из текстовых полей, если есть неправильный идентификатор электронной почты, тогда кнопка должна быть отключена. Помогите мне в этом. Если есть неправильный адрес электронной почты и нет телефона, я хочу отключить функцию или кнопку кнопки. Моя проблема в том, что я использую отдельные функции 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>
Теги:

3 ответа

1

Используйте $("#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();
  }
  });
1
  1. Сначала отправить кнопку отправки, пока у вас не будет всех элементов формы
  2. С полями ввода HTML5 (электронная почта и текст) у вас уже есть необходимый атрибут, но нужно указать обязательный = "required"
  3. Имейте событие onChange для последнего (обязательного) поля, проверьте, прошла ли проверка.

Проверьте это для получения дополнительной информации и дополнительной информации. Если поле ввода пуст, отключите кнопку отправки

0

Просто отключите кнопку в верхней части вашего javascript.

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

Затем в вашем регулярном выражении, если оно истинно, установите для него значение false.

EDIT. Вероятно, лучше всего настроить переменные регулярного выражения глобальными, а затем вы можете сделать это выражение для обоих регулярных выражений.

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

Ещё вопросы

Сообщество Overcoder
Наверх
Меню