0

チェックボックスがチェックされている場合、またはその逆の場合にアンカータグをクリック可能にする方法はありますか(チェックボックスがチェックされていない場合、アンカータグはクリックできません)?

私がこれを求めている理由は、私がカスタムマウスガードサイトで作業していて、クライアントがマウスガードをカートに追加してチェックアウトに進む前に、訪問者がチェックボックスをクリックすることを望んでいるためです (条件に同意することを意味します)。

現在、イメージタグの周りにアンカータグがあります（機密保持契約に署名しているため、コードを表示できませんが、セットアップを表示します）：

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

<a href="" target="" class="" onClick=""><img src="" border="" alt="" /></a>

目標を達成する方法を教えてください。ありがとう。

4

3 に答える 3

1

アンカーのonclickでは、チェックボックスがチェックされていない場合は false を返し、チェックボックスがチェックされている場合は true を返すことができます。これは、チェックボックスがオンになっているときにリンクがたどられることを意味します。

<input type="checkbox" name ="" id="terms" />
<a href="http://google.com" target="" class="" onClick="return checkTerms();"><img src="" border="" alt="" /></a>

<script>
function checkTerms()
{
    var ticked = document.getElementById("terms").checked;

    if(!ticked) alert("Please accept the terms");

    return ticked;
}
</script>
于 2013-01-07T09:03:50.600 に答える
0

これをコードに追加する必要があります。

<a href="" target="" class="" onClick="checkInput(); return false;"><img src="" border="" alt="" /></a>

次にcheckInput、チェックボックスの状態を確認します。

チェックされている場合は、使用します

document.location = "Add to Cart Location";

別の方法: これを使用できます:

document.getElementById("myCheckBox").addEventListener ("change", function() {
    if(this.checked) {
        document.getElementById("myLink").href = "Proper HREF";
    } else {
        document.getElementById("myLink").href = "#";
    }
}
于 2013-01-07T09:00:35.050 に答える
0

これを div でラップしたとします。次のようなことができます。

<div class="login">
 <span>I have read and agree to the terms and conditions. <input type="checkbox" name ="" id="" /></span>
 <a href="" target="" class="" onClick=""><img src="" border="" alt="" /></a>
</div>

次に、JavaScript で。

$('.login a').click(function(ev) {
   var $checkbox = $('.login input');

   if ( $checkbox.is(':checked') ) {
     console.log('GO AHEAD');
   } else {
     alert('You need to accept the terms and conditions before proceeding');
     $checkbox.addClass('error');
     ev.preventDefault();
   } 
});
于 2013-01-07T09:02:29.733 に答える