javascript - 没有表单的jQuery复选框验证

Question

我想用 jQuery 或纯 javascript 做一个验证函数。

这是我的复选框

<input type="checkbox" name="terms" id="terms">

这是我的链接按钮

<label id="kosullar" for="terms">
<a class="fancybox-effects-d" data-fancybox-type="iframe" onclick="" href="kosullar.php">KULLANIM  &nbsp;KOSULLARINI  &nbsp;KABUL&nbsp; EDIYORUM</a>
</label>

如果选中复选框，则进程将继续重定向我的hrefurl，如果我不想向用户显示 alert()。

而已。

你能给我举个例子吗？

Answer 1

Can you try this,

     function Accept(dat){

            var terms = $('#terms').is(':checked');

            if(terms){
                window.location.href=dat.href;
            }else{
                alert('not checked!');
                return false;
            }
      }

HTML Section:

    <input type="checkbox" name="terms" id="terms">

    <label id="kosullar" for="terms">
        <a class="fancybox-effects-d" data-fancybox-type="iframe" onclick="return Accept(this);" href="kosullar.php">KULLANIM  &nbsp;KOSULLARINI  &nbsp;KABUL&nbsp; EDIYORUM</a>
    </label>

Another method:

 $(function(){

      $(".fancybox-effects-d").click(function(){

           var terms = $('#terms').is(':checked');

            if(terms){
                window.location.href=$(this).attr('href');
            }else{
                alert('not checked!');
                return false;
            }
        });

   });

HTML:

<input type="checkbox" name="terms" id="terms">

    <label id="kosullar" for="terms">
        <a class="fancybox-effects-d" data-fancybox-type="iframe"  href="kosullar.php">KULLANIM  &nbsp;KOSULLARINI  &nbsp;KABUL&nbsp; EDIYORUM</a>
</label>

Answer 2

在您onclick定义一个函数并通过this，return false以停止默认操作

onclick="verifyCheck(this); return false;"

function verifyCheck(elem) {
    var cb = document.getElememtById("terms");

    if (cb.checked) { 
        location.href = elem.href;
    } else {
         alert("Check the box!");
    }
}

Answer 3

$('.fancybox-effects-d').click(function(e) {
    if (!($('#fancybox-effects-d').is(':checked'))) {
        e.preventDefault();
    }
});

Answer 4

尝试这个。

 <a class="fancybox-effects-d" data-fancybox-type="iframe" onclick="return Validate();" href="kosullar.php">

Javascript 方法

function Validate()
{
 If($("#terms").is(":checked"))
 {
    //do your code to go to next step
 }
 else
 {
  alert("Please check the checkbox");
  return false;
 }
}