Jquery mobile - 使用pageinit刷新复选框

我正在使用另一个页面上的链接列表调用一个页面（请参阅下面的代码）。像这样的列表Jquery mobile - 使用pageinit刷新复选框

<ul data-role="listview" data-theme="g"> 
     <li><a href="test.html">test</a></li> 
</ul>

下面的代码是test.html页面。

我在这些页面上使用jquery mobile。只有前3个复选框后面的复选框似乎在页面加载时通过单击链接正确刷新（显示为选中状态）。前三个复选框总是显示为未选中状态，其检查值设置为false。不寻常的是，如果我在将复选框设置为true的语句后面放置if语句，则复选框checked值将为true，但在呈现的页面上显示为false，并查看元素区域中的选中值的网络检查员。刷新页面（使用F5或地址栏附近的刷新按钮）时，复选框按照您的预期进行刷新。任何帮助将不胜感激。虽然下面的示例代码似乎只是将所有复选框设置为一个选中的值，但我确实（在我的真实页面中）根据记录集中的数据设置了它们的值，所以我不能只将质量设置为true并刷新。我必须遍历记录集并相应地设置复选框值。下面的代码只是我所遇到的错误的简单再现。谢谢！

<!doctype html> 
<html lang="en"> 
    <head> 
     <meta charset="utf-8" /> 
     <title>Checkbox</title> 
     <meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1"> 
      <link rel="stylesheet" href="jqm1/jquery.mobile.structure-1.0.1.min.css" /> 
      <script src="jqm/jquery-1.7.1.min.js"></script> 
      <script src="jqm/jquery.mobile-1.0.1.min.js"></script> 

     </head> 
     <body> 
     <div id="loadCB" data-role="page"> 
      <script type="text/javascript"> 
       $("#loadCB").live('pageinit', function() { 
        // do something here... 


        for (i=0;i<=5;i++) 
        { 
        $("#checkbox-"+i).prop("checked", true); 
        $("#checkbox-"+i).prop("checked", true).checkboxradio("refresh"); 
        } 


       }); 
      </script> 

      <article data-role="content"> 


       <form id="frmR"> 
        <input type="checkbox" name="checkbox-0" id="checkbox-0" class="custom" value="0"/> 
        <label for="checkbox-0">checkbox-0</label> 
        <input type="checkbox" name="checkbox-1" id="checkbox-1" class="custom" value="1"/> 
        <label for="checkbox-1">checkbox-1</label> 
        <input type="checkbox" name="checkbox-2" id="checkbox-2" class="custom" value="2"/> 
        <label for="checkbox-2">checkbox-2</label> 
        <input type="checkbox" name="checkbox-3" id="checkbox-3" class="custom" value="3"/> 
        <label for="checkbox-3">checkbox-3</label> 
        <input type="checkbox" name="checkbox-4" id="checkbox-4" class="custom" value="4"/> 
        <label for="checkbox-4">checkbox-4</label> 
        <input type="checkbox" name="checkbox-5" id="checkbox-5" class="custom" value="5"/> 
        <label for="checkbox-5">checkbox-5</label> 

        <input type="submit" value="Set Rules" /> 
       </form>    


      </article>   
     </body> 
    </div> 
    </html>

来源

2012-02-20 Paul in Colorado

我写的微件的相当全面的列表，并通过刷新它们的方法： http://andymatthews.net/read/2011/12/14/Refreshing-jQuery-Mobile-listviews,-buttons,-select-dropdowns,-and-input-fields

也许这会回答你的问题？

来源

2012-02-20 17:17:07 commadelimited

感谢您的答复。看起来我已经使用了类似的代码，就像你在页面上显示的那样。当从其他页面加载页面时，我的复选框似乎无法正确刷新。 – 2012-02-22 03:17:48

检查这个代码

$("#loadCB").live('pageinit', function() { 
        // do something here... 


        $("input[type='checkbox']").attr("checked",false).checkboxradio("refresh"); 


       });

来源

2012-02-23 05:38:57 Hkachhia

Harry，感谢您的反馈。虽然这将设置所有复选框进行检查，但它不能解决我提供的示例中的问题。我基于从数据库返回的记录集来设置复选框值，因此我无法将所有值设置为true。我必须遍历记录，并只设置应检查的复选框。我的问题是，前三个复选框似乎永远不会正确刷新。谢谢。 – 2012-02-26 04:12:31

Jquery mobile - 使用pageinit刷新复选框

回答

相关问题