フォームで必須のチェックボックスはどのようにして行いますか？

Question

ボックスをクリックした後、あるページから別のページに移動するチェックボックスが必要です。チェックボックスは、その横にある利用規約のリンクを読んだ場合に必要です。

私は、このような何かこれを行う方法を半分だけ確信している：しかし、私は全くのチェックボックスを表示することはできません現時点では

<script type="text/javascript" language="javascript"> 
$(document).ready(function() { 
     if ($('form#prepay input:checkbox', 'confirm_prepay_terms').is(':checked') { 
       return true; 
     } else { 
      $('#confirm_terms_hint').text('Please try again - you need to check the box to move on'); 
      $('#confirm_terms_hint').css('font-weight', 'strong'); 
      return false; 
     } 
} 
</script> 

：jQueryを使って

<input type="checkbox" value="confirm_prepay_terms" name="confirm_prepay_terms" align="middle" /> 

おそらく私のHTMLは間違っていますか？

希望すると助かります。

Answer 1

あなたのHTMLは問題ありません。チェックボックスが表示されますが、テキストはありません。

if ($('form#prepay input:checkbox', 'confirm_prepay_terms').is(':checked') { 

が

if ($('form#prepay input:checkbox', 'confirm_prepay_terms').is(':checked')) { 

であるべきで、最後の行に)：あなたは決算)が欠落しているあなたのJavaScriptでは

<input type="checkbox" value="confirm_prepay_terms" name="confirm_prepay_terms" align="middle" >​Text here</input>​​​​​​​​​​​​​​​​​​​​​​​ 

：あなたは、いくつか使用してこのマークアップを追加することができ

を

} 
</script> 

}) 
</script> 

とあなたの選択する必要がありますが誤っている

$('form#prepay input:checkbox', 'confirm_prepay_terms') 

が

$('form#prepay input:checkbox[name=confirm_prepay_terms]') 

する必要がありますこれはmultiple attribute selector

と

を使用しています0

$('#confirm_terms_hint').css('font-weight', 'strong'); 

でなければなりません

$('#confirm_terms_hint').css('font-weight', 'bold'); 

font-weightあなたはtrueやfalseを返却している何strong値（see here）...あなたのスクリプトでbold代わり

を使用していませんが、コードは何で呼び出されていません - ページのロードが完了するとすぐに実行されます。フォーム検証を実行する場合は、jQueryのメソッドを見てください。例では、これを次のようになります。

$(document).ready(function() { 
    $('#prepay').submit(function() { 
     if ($('form#prepay input:checkbox[name=confirm_prepay_terms]')) { 
       return true; 
     } else { 
      $('#confirm_terms_hint').text('Please try again - you need to check the box to move on'); 
      $('#confirm_terms_hint').css('font-weight', 'bold'); 
      return false; 
     } 
    }); 
}); 

これは、現在提出されてからフォームを妨げる - あなたが提出したイベントにfalseを返すよう。

Fully working example here

Answer 2

私はあなたがいる限り、彼らがサービスを使用する前に、この条件に同意しなければならないようチェックボックスを提供することが必要だとは思いません。

あなたは次のようなストレスのないように自分で行うことができます。

- Provide a link to the terms and conditions for reading 

    - Notify them that they have automatically accept this terms while proceeding.