чекбокс запускающий яваскрипт

253

17 августа 2017, 23:30

есть вот такой вот код

<script>
function boxDisable(e, t) {
        if (t.is(':checked')) {
          $(e).find('input').attr('disabled', true);
        } else {
          $(e).find('input').removeAttr('disabled');
        }
    }
</script>
    <form name="myForm" action="submit.php" onsubmit="return validateForm()" method="post">
    Name: <input type="text" name="fname">
    Birthday:<input type="date" name="fday"><br>
    Refferal: <input type="text" name="frefferal">
    Country: <input type="text" name="fcountry">
    City: <input type="text" name="fcity">
    Email:<input type="email" name="femail">
    <input type="radio" name="fgender" value="male" checked> Male<br>
    <input type="radio" name="fgender" value="female"> Female<br>
    <input type="checkbox" name="faccept" onclick="boxDisable(appTimes, $(this));" value="Bike" >Accept<br>
    <input type="submit" name = "submitbtn" value="Submit">
    </form>

но почему то при нажатии на чекбокс ничего не происходит. Мне нужно чтоб при выключенном чекбоксе кнопка субмит неработала а при включеном чекбоксе работала

Answer 1

Можно попробовать вот так:

jQuery(document).ready(function($) { 
  $(document).on('change', 'input[name="faccept"]', function() { 
    if ($(this).is(':checked')) { 
      $('[type="submit"]').removeAttr('disabled'); 
    } else { 
      $('[type="submit"]').attr('disabled', true); 
    } 
  }); 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
<form name="myForm" action="submit.php" onsubmit="return validateForm()" method="post"> 
    Name: <input type="text" name="fname"> 
    Birthday:<input type="date" name="fday"><br> 
    Refferal: <input type="text" name="frefferal"> 
    Country: <input type="text" name="fcountry"> 
    City: <input type="text" name="fcity"> 
    Email:<input type="email" name="femail"> 
    <input type="radio" name="fgender" value="male" checked> Male<br> 
    <input type="radio" name="fgender" value="female"> Female<br> 
    <input type="checkbox" name="faccept" value="Bike" >Accept<br> 
    <input type="submit" name = "submitbtn" value="Submit"> 
    </form>

Или используя функцию:

function boxDisable(t) { 
  if (t.is(':checked')) { 
    $(t).parents('form').find('[type="submit"]').attr('disabled', true); 
  } else { 
    $(t).parents('form').find('[type="submit"]').removeAttr('disabled'); 
  } 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
<form name="myForm" action="submit.php" onsubmit="return validateForm()" method="post"> 
  Name: <input type="text" name="fname"> Birthday: 
  <input type="date" name="fday"><br> Refferal: <input type="text" name="frefferal"> Country: <input type="text" name="fcountry"> City: <input type="text" name="fcity"> Email: 
  <input type="email" name="femail"> 
  <input type="radio" name="fgender" value="male" checked> Male<br> 
  <input type="radio" name="fgender" value="female"> Female<br> 
  <input type="checkbox" name="faccept" onchange="boxDisable($(this));" value="Bike">Accept<br> 
  <input type="submit" name="submitbtn" value="Submit"> 
</form>