JQueryのモバイルトランジションのチェックボックスの選択は、JQueryのonclick関数（）で2回動作しませんか？

Question

私はテキストボックスのIDに基づいて2回目のチェックボックスを選択できません。テキストボックスからのIDのパスは（1,2,3、..）のようにカンマ（、）で区切ります。 初めてページが読み込まれると、すべて正常に動作しますが、チェックボックスをオフにしてアンカータグのチェックをもう一度試してみると、動作しません。助けをお待ちしています。

$(document).on("click", "a[id$='btnShowRates']", function (e) {  
 
    if ($('input[type=text][id$=rate]').val() != "") { 
 
    var arrate = $('input[type=text][id$=rate]').val().split(','); 
 
    var targetcheckboxes = $.map(arrate, function (i) { return document.getElementById(i) }); 
 
    $(targetcheckboxes).prop('checked', true);         
 
    } 
 
    else { $('[id$=listRates] input[type=checkbox]').prop('checked', false); }     
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div data-role="controlgroup"> 
 
    <a id="btnShowRates" href="#pgRates" data-transition="slideup" data-role="button" runat="server"> 
 
    <span class="left ad_option_text small_text"><%=MBBE_Revamped.Labels.GetLabel(langID, hotel, "RateCorpCode") %></span> 
 
    <input id="rate" type="text" /> 
 
    </a> 
 
    <section id="pgRates" data-role="page" data-theme="a"> 
 
    <bhead:custHead id="CustHead1" runat="server" /> 
 
    <header data-role="header" class="mbe_detail_header"> 
 
     <p class="nospace">Hotel Rates</p> 
 
    </header> 
 
    <div data-role="content"> 
 
     <fieldset data-role="controlgroup" id="listRates" data-icon="false" runat="server"> 
 
     <--! Here comes dynamic checkboxes --> 
 
      <div style='position:relative;'> 
 
      <input type='checkbox' id='1' data-display-name='Rack/General' /> 
 
      <label for='1'>Rack/General</label> 
 
      <img id='img_1' class='checkboxFixIconLeft' /> 
 
      </div> 
 
      <div style='position:relative;'> 
 
      <input type='checkbox' id='4' data-display-name='Government' /> 
 
      <label for='4'>Government</label> 
 
      <img id='img_4' class='checkboxFixIconLeft' /> 
 
      </div> 
 
      <div style='position:relative;'> 
 
      <input type='checkbox' id='6' data-display-name='Package' /> 
 
      <label for='6'>Package</label> 
 
      <img id='img_6' class='checkboxFixIconLeft' /> 
 
      </div> 
 
      <!-- End --> 
 
      </fieldset> 
 
     <div class="btn_container"> 
 
      <a data-role="button" data-theme="b" data-rel="back">Confirm</a> 
 
     </div> 
 
     </div> 
 
     </section> 
 
    </div>

Answer 1

私は後にリフレッシュを書いていないので、チェックボックスをチェックし、jQueryのまたはJavaScriptを介して携帯チェックボックスをチェックし、オフにリフレッシュを追加するために必須であることが起こっている、問題の私を発見しました。以下は、リフレッシュ関数の詳細です。

refresh（）戻り値：jQuery（プラグインのみ） checkboxradioを更新します。 JavaScriptを使用してチェックボックスラジオを操作する場合は、ビジュアルスタイルを更新するために、そのメソッドのrefreshメソッドを呼び出す必要があります。

ので、私の修正jqueryの機能がある -

$(document).on("click", "a[id$='btnShowRates']", function (e) { 
 
    
 
     if ($('input[type=text][id$=rate]').val() != "") { 
 
      var arrate = $('input[type=text][id$=rate]').val().split(','); 
 
      var targetcheckboxes = $.map(arrate, function (i) { return document.getElementById(i) }); 
 
      $(targetcheckboxes).prop('checked', true).checkboxradio('refresh'); 
 
      
 
      for (var i in targetcheckboxes) {    
 
       setCustomChecked(true, $(document).find('input[type="checkbox"]:checked')); 
 
      }       
 
     } 
 
    
 
     else { $('[id$=listRates] input[type=checkbox]').prop('checked', false).checkboxradio('refresh'); } 
 
    
 
    });