0

我有一个 3 页的应用程序。让我们称它们A为B和C。

我进行 Ajax 调用来构建页面并根据标志（比如说flag1）更改图标并根据flag2. 图标出现在具有不同 ID 和 的所有 3 个sel1页面sel2上sel3。

它在大多数情况下都可以正常工作，除非我在会话中第一次将页面更改为页面 A、B 或 C。在这种情况下，图标不会切换。任何帮助表示赞赏。

这是代码片段

    $(document).ready(function(){ 
    $("#sendajax").click(function() {               
    $.ajax({ type: "POST", url: "servlet2",  datatype: "json", 
         success:  populatedata});              
        };
});

    Function populatedata(data){        
       if (data.flag1 == "A" ){
          buildpageA(data);
          $.mobile.changePage("#pageA", {transition:"fade"});   
          $("#pageA").trigger('refresh');                   
    } else if  (data.flag1 == "B" ){
          buildpageB(data);
          $.mobile.changePage("#pageB", {transition:"fade"});   
         $("#pageB").trigger('refresh');
    }else  if(data.flag1 == "C" ){
         buildpageC(data);
         $.mobile.changePage("#pageC", {transition:"fade"});    
         $("#pageC").trigger('refresh');
    }

    Function buildpageA(data){
      if  (data.flag2 != "")                     
    $('#sel1').attr('data-icon', 'info').find('.ui-icon').
              removeClass('ui-icon-info').addClass('ui-icon-error');                
      else
     $('#sel1').attr('data-icon', 'error').find('.ui-icon').
                addClass('ui-icon-info').removeClass('ui-icon-error');              
          $("#sel1").trigger('refresh');
          ……
            }
         }

      Function buildpageB(data){
           if  (data.flag2 != "")                    
        $('#sel2').attr('data-icon', 'info').find('.ui-icon').
                removeClass('ui-icon-info').addClass('ui-icon-error');      
           else
        $('#sel2').attr('data-icon', 'error').find('.ui-icon').
                addClass('ui-icon-info').removeClass('ui-icon-error');          
           $("#sel2").trigger('refresh');
         ……
         }

          Function buildpageC(data){
             ...... you get the point    .}

JSP：

     <body>
      <page data-role= page  id =”pageA”&gt; 
        <a href="#" data-role="button"   id="sel1" data-icon="" ></a></page>

      <page data-role= page  id =”pageB”&gt;
        <a href="#" data-role="button"   id="sel2" data-icon="" ></a> </page>

      <page data-role= page  id =”pageC”&gt;
        <a href="#" data-role="button"   id="sel3" data-icon="" ></a></page>
     </body>
4

1 回答 1

1

要更改图标，请使用.buttonMarkup。

$('#sel').buttonMarkup({ icon: 'error' });

注意：对于 jQuery Mobile，不要使用.ready()，坚持使用 jQuery Mobile 事件。http://api.jquerymobile.com/category/events/

于 2013-04-29T12:56:57.197 回答