1

チェックボックス状態のグループ (JQueryMobile フレームワークを使用して定義) を複数回更新できるコントロールの実装に問題があります。

非常に単純なプレイグラウンド コードは次のとおりです: http://jsfiddle.net/XR44Q/3/ (JQuery 1.9.1 および JQueryMobile 1.3.0 を使用、26 行の html+javascript コード) 実際、問題は説明よりも単純です。グループ コントロールのチェックボックスを操作して、グループ コントロールを 2 回クリックした後、グループ化されたボックスがどのように応答を停止するかを確認します。コードとアイデアはとてもシンプルなので、うまくいくはずです:)

今後の参考のために、jsfiddle のコードを以下に示します。

HTML:

<form>
  <input id="group_control" name="g" type="checkbox" />
  <label for="group_control">Group</label>
  <fieldset data-role="controlgroup" data-type="vertical" class="sub_cat">
    <input id="c01" name="c01" type="checkbox" class="cXX" />
    <label for="c01">A</label>
    <input id="c02" name="c02" type="checkbox" class="cXX" />
    <label for="c02">B</label>
    <input id="c03" name="c03" type="checkbox" class="cXX" />
    <label for="c03">C</label>
  </fieldset>
</form>

Javascript:

$(document).ready(function () {
  $("#group_control").click(function () {
    // the checkbox state can be correctly retrieved
    alert("Group checked? "+$('#group_control').is(':checked'));
    $("INPUT[class='cXX']").attr(
        'checked', $('#group_control').is(':checked')
    ).checkboxradio("refresh");
  });
});

チェックボックスは、最初の 2 つの変更で正しく更新できます。したがって、チェックされていない状態から始めて、コントロールはすべてのボックスをチェックされた状態に変換してから、チェックされていない状態に戻すことができます。ただし、この時点で、コントロールはボックスを選択できなくなります。

個々のチェックボックスは、この状態でユーザーがクリックすることで引き続き制御できます。チェックボックスがユーザーによって変更された場合、実行中のチェックボックス コントロールはそれらを選択しようとしても効果がなく、選択を解除しようとしてもすべてのボックスを正しく選択解除します。そのため、コントロールがチェックボックスのグループを2 回変更した後に選択しようとした場合にのみ、問題が発生します。

ページの dom とプロパティを調べると、JQueryMobile によって生成された入力要素がコントロール イベントに続いて正しく更新されていることがわかりますが、 'data-icon' 属性は'checkbox-on' に変換する必要があるときに'checkbox-off' のままです。ユーザーがチェックボックスをクリックすると、この属性が正しく更新されるため、「data-icon」プロパティが jquery mobile によって正しく管理されない理由を実際に理解することが問題です。

フィードバックをお寄せいただきありがとうございます！

4

2 に答える 2

0

「checked」属性なしで開始します。最初にチェックされると、checked 属性が true になります。2 回目は、チェック済みの属性が false に変更されますが、まだチェック済みの属性があるため、その後も false に変更しようとします。チェックされた属性の存在以外に基づいて評価する必要があります。

于 2013-04-04T18:57:05.527 に答える