2012-08-27 9 views
10

私はチェックボックスを使用しているので、チェックボックスをオンまたはオフにします。 しかし、チェックを外すとjQueryUIのモーダルポップアップを使用して実際にそのことを確認しています。したがって、OKまたはをキャンセルすることができます。をキャンセルし、チェックボックスをオフにするには、OKをクリックする必要があります。
チェックボックスが非表示になるのを防ぐためにチェックを外したイベントをキャッチして、ユーザがクリックした場合にプログラムでチェックを外してください。OKチェックボックスのチェックを外す(無効または読み取り専用なし)

どうすればいいですか?

PS:ユーザーがをクリックした後に再チェックできることがわかっています。をキャンセルしますが、これでは望ましくないイベントが発生してしまいます(check)。

$("#test").on('change', function() { 
    this.checked=!this.checked?!confirm('Really uncheck this one ?'):true; 
}); 
​ 

答えて

14
$("#checkboxID").on("click", function (e) { 
    var checkbox = $(this); 
    if (checkbox.is(":checked")) { 
     // do the confirmation thing here 
     e.preventDefault(); 
     return false; 
    } 
}); 
+0

'.live()'は、最新バージョンのjQueryでは非推奨です。代わりに '.on()'を使用してください。 :) – AdityaParab

+0

ああ、それを知らなかった、更新 –

+0

それは今働いている:)ありがとう! – user1498572

0
$("#yourCheckBoxId").on('change',function(e){ 
    e.preventDefault(); 
    $("#yourPopDiv").popup(); 
}); 

preventDefault()はあなたinput[type="checkbox"]

のそして、あなたのポップアップのdiv

$("#ok").on('click',function(){ 
    $("#yourCheckBoxId").attr("checked",true); 
}); 
10

何かのようにデフォルトの動作を無効にします

+0

ベスト1)+1 – Uttara

+1

+1いいね。あなたはそれをさらに短く/より明確にすることもできます: 'this.checked = this.checked || !confirm( '本当にこれをチェックしない?'); ' – nbrooks

0

ピュアCSSソリューション

選択チェックボックスのような -

input[type="checkbox"] { 
    pointer-events: none; 
} 

かなりうまく機能し、そして今、あなたはあなたの選択の任意の要素のクリックであなたのチェックボックスを切り替えることができます。

関連する問題