2

ユーザーに直接アクセスさせたくないチェックボックスがあります。私は彼らにいくつかの条件を受け入れてもらいたい。これを行うには、無効になっているチェックボックスをクリックして、用語を含むこのミニポップアップ（チェックボックスをオンにしない）を開き、読者がそれらを読んで受け入れることができるようにします。それらを受け入れると、ポップアップが閉じ、チェックボックスがオンになります。私が抱えている問題は、無効になっているチェックボックスをクリックすると関数を実行できるかどうかわからないことです。

4

4 に答える 4

4

無効な要素のクリックを処理するのは確かに難しいです...しかし、それは望ましいユーザーエクスペリエンスではないと思います。チェックボックスが無効になっている場合、一部のユーザーはそれを見て、クリックしようとすることさえ嫌がります。代わりに、クリック イベントをインターセプトし、 preventDefaultを使用して独自の目的に使用することを検討してください。 

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

$(document).ready(function() {
    $("#cb").click(function(e) {
        // cancel click event so that checkbox remains unchecked
        e.preventDefault();

        // display popup here, then manually check the checkbox if needed
    }
});
于 2012-06-23T05:31:44.477 に答える
1 
$('#chk').click(function () {
            if (confirm('Accept')) {
                $(this).attr('checked', 'checked');
            }
            else {
                 $(this).attr('checked', false); }
        });
于 2012-06-23T06:59:40.800 に答える
0

@dbaseman

これが私のコードです。見てください。ここでは、divでアラートが表示されますが、チェックボックスではアラートが表示されません。

<html>
<head>
<script type="text/javascript" src="jQuery.js"></script>
<script type="text/javascript">
$(document).ready(function(){
 $("#checkbox, #hello").click(function(){

       alert("hello");
    });
});
</script>
</head>

<body>
<div id="checkbox">
    <p> hello</p>
<input type="checkbox" id="hello" disabled="disabled"  />
</div> 
</body>
</html>
于 2012-06-23T05:40:42.270 に答える
0

チェックボックスを無効にすると、クリック イベントが適切に処理されず、「無効」と表示される場合があります。

しかし、これを試すことができます：

  • ポップアップが表示された場合に保存するチェックボックスに属性を追加します (例: data-popup="0")
  • チェックボックスの onclick イベントを処理する
  • ポップアップが表示された (data-popup="1" ) 場合は、単純に true を返して、ポップアップのチェックに使用できるようにします。
  • ポップアップが表示されなかった場合 (data-popup="0" )、デフォルトの動作を防止し、data-popup="1" を設定して、利用規約とともにポップアップを表示します

ポップアップのデザインによっては、ポップアップに新しいチェックボックスを追加して、ユーザーが利用規約を読んだときに、ポップアップから直接利用規約に同意できるようにすることで、もう 1 つの改善点が得られます。その場合、ポップアップのチェックボックスでクリックイベントを処理し、ページのチェックボックスも自動的にチェックする必要があります。

于 2012-06-23T05:36:25.303 に答える