1

RyanFaitのカスタムフォーム要素を使用して単純なフォームを作成しました。現在、「すべてチェック」/「すべてチェック解除」機能を実装しようとしています。

ユーザーが目的の結果を得るためにボタンを2回クリックする必要があることを除いて、私が持っているものはほとんど機能します。カスタムフォーム要素スクリプト内からこの関数を呼び出す必要があると感じていますが、その方法がわかりません。

私はJQuery、カスタムフォーム要素（http://ryanfait.com/resources/custom-checkboxes-and-radio-buttons/custom-form-elements.js）を使用しており、これは次のとおりです。

<script type = "text/javascript">
function cboxToggle(group, action) {
for( var i=0, len = group.length; i < len; i++) {
group[i].checked = action;
}
}

</script>

私のHTML：

<form name="myname" action="checkboxes.asp" method="post">
<input type = "button" value = " CHECK ALL" onclick = "cboxToggle(check_list, !this.checked)"><br>
<input type = "button" value = " UNCHECK ALL" onclick = "cboxToggle(check_list, this.checked)"><br>

<p><input type="checkbox" name="check_list" value="1" class="styled" />Option 1 </p> 
<p><input type="checkbox" name="check_list" value="2" class="styled" />Option 2 </p>
<p><input type="checkbox" name="check_list" value="3" class="styled" />Option 3 </p>
</form>

どんな助けでもいただければ幸いです-ありがとう！

4

2 に答える 2

0

jQueryを使用している場合は、jQueryを最大限に活用してみませんか？これは、インラインコードがないことも意味します...最初にボタンにIDを追加します。次に、グループを適切に使用していることを確認します。そうする代わりに、を使用しgroupますgroup[]。次に、このコードを使用すると、機能するはずです。

var ckToggle = function (group, action) {
  $('[name="'+ group +'"]').prop('checked', action)
}

$('#buttonAll').click(function(){ ckToggle('check_list[]', true) })
$('#buttonNone').click(function(){ ckToggle('check_list[]', false) })
于 2012-07-05T20:52:27.397 に答える
0

以下のURLをご覧ください

カスタムフォーム要素のチェックボックスをオフにします

于 2014-05-17T08:37:52.607 に答える