1

チェックボックスが選択されている場合にのみクリック可能なボタン/リンクを設定しようとしています。したがって、これまでの私のコードは

<form>
<input type="checkbox" name="agreeCheckbox" value="agreeCheckbox">By clicking this you agree that you are adding a subscription/recurring product to your order<br>
</form>

<a href="exmaple.com">This link is only clickable if checkbox is checked</a>

JavaScriptに関しては初心者ですが、これをJavaScriptで行う必要があると思います。ありがとう

4

4 に答える 4

2

このコードは、いくつかのid属性を要素に追加して、Javascript にいくつかのフックを提供します。チェックボックスがクリックされるまで、アンカーのデフォルトアクションを非表示にして防止します。

HTML

<form>
<input id="agreement" type="checkbox" name="agreeCheckbox" value="agreeCheckbox">By clicking this you agree that you are adding a subscription/recurring product to your order<br>
</form>

<a href="exmaple.com" id="link">This link is only clickable if checkbox is checked</a>

Javascript

var chk = document.getElementById("agreement");
var anchor = document.getElementById("link");
anchor.style.display = "none";
anchor.onclick = function(e){
  e.preventDefault();
}

chk.onclick = function(){
    if(chk.checked){
        anchor.style.display = "inline";
      anchor.onclick = "";
    }
}

実施例

http://jsfiddle.net/zVCD7/

于 2013-04-26T19:31:42.847 に答える
0

これを実現するには、さまざまな方法があります。新しいメソッドのほとんどには、おそらく jQuery が含まれます。

まず、jQuery (Google の作品) を含めます。

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js" type="text/javascript"></script>

次に、リンクではなくリンクを作成します。

<div id="mylink">This link is only clickable if checkbox is checked</div>

次に、ボックスがクリックされたら、クリック可能にします。

<script type="text/javascript">
$("input[name = 'agreeCheckbox']").click(function(){
  $("#mylink").html('<a href="exmaple.com">This link is only clickable if checkbox is checked</a>');
});
</script>
于 2013-04-26T19:31:51.683 に答える