你如何做一個表單中的強制複選框？

我需要一個複選框，在單擊該框後從一個頁面移動到另一個頁面。由於您已閱讀旁邊的條款和條件鏈接，因此該複選框應該是必需的。你如何做一個表單中的強制複選框？

我只有一半知道如何做到這一點，是這樣的：

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

使用jQuery：

<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>

此刻雖然，我不能在所有瀏覽複選框在頁面上，所以也許我的HTML不正確？

希望你能幫上忙。

來源

2012-04-10 snakespan

任何jsfiddle到hava看？它似乎沒有問題，除了對齊參數。 – pollirrata 2012-04-10 15:30:09

您錯過了.ready（）的右括號。嘗試將'}'變成'}）;'http://jsfiddle.net/dwRvE/ – RyanS 2012-04-10 15:32:27

您的HTML很好 - 會顯示一個複選框 - 但沒有任何文本。你可以添加一些使用這個標記：

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

在你的JavaScript你缺少一個右)：

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

應該

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

，並在最後一行)：

} 
</script>

應該

}) 
</script>

，你的選擇是不正確

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

應該

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

它使用multiple attribute selector

和

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

應該

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

font-weight沒有strong值（see here）......使用bold代替

在腳本

你正在返回true或false但代碼沒有被任何東西叫 - 頁面完成加載後立即執行。如果您想執行表單驗證，請查看jQuery中的.submit()方法。一個例子是這樣的：

$(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

來源

2012-04-10 15:31:51 ManseUK

非常感謝您的幫助，非常感謝。 – snakespan 2012-04-25 11:23:43

-1

我不認爲這是必要的你，只要他們必須接受在使用服務前此條款和條件提供一個複選框。

你可以做下面的事情，無壓力的自己。

- Provide a link to the terms and conditions for reading 

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

來源

2012-04-10 16:34:38 Joberror

你如何做一個表單中的強制複選框？

回答

相關問題