JQuery Mobile 1.3选择菜单动态刷新

Question

您好，我使用JQM 1.3和JQuery 1.9.1 ...我试图得到一个动态的selectmenu没有解决方案工作。

首先我在pagebeforeshow事件中用createDocument（div ...）和.setAttribute（id，...）创建一个selectmenu。然后我用了很多的变化第一线，第二线和组合的..

$("#select-keywords-list").selectmenu(); 
$("#select-keywords-list").selectmenu("refresh"); 

毫无效果却为我..

后，我加入它，我听它在domready中（$（＃页）.ready）用于更改事件。 在浏览器中，它工作得很好，但在手机上，我不能让它工作。希望可以有人帮帮我。

我也试过本机菜单真假..

谢谢

发作

Answer 1

工作例如：http://jsfiddle.net/Gajotres/dEXac/

$(document).on('pagebeforeshow', '#index', function(){  
    // Add a new select element  
    $('<select>').attr({'name':'select-choice-1','id':'select-choice-1','data-native-menu':'false'}).appendTo('[data-role="content"]'); 
    $('<option>').html('Select option!').appendTo('#select-choice-1'); 
    $('<option>').attr({'value':'1'}).html('Value 1').appendTo('#select-choice-1'); 
    $('<option>').attr({'value':'2'}).html('Value 2').appendTo('#select-choice-1');  
    // Enhance new select element 
    $('select').selectmenu(); 

    $(document).on('change', '#select-choice-1', function(){  
     alert($(this).find("option:selected").text()); 
    });   
}); 

一件事，不要使用文件随着jQuery Mobile准备就绪，他们不能一起正常工作。而是使用pageinit事件。如果您想了解更多关于它看看这里：jQuery Mobile: document ready vs page events

Answer 2

我知道有一个模板引擎公司也许更容易，但我想这样

  function renderItemsKeywords(results) { 
     var elementRoot = document.createDocumentFragment(); 
     var elementDiv = document.createElement("div"); 
     elementDiv.setAttribute("data-role", "fieldcontain"); 

     var elementL = document.createElement("label"); 
     elementL.setAttribute("for", "select-keywords-list"); 
     elementL.setAttribute("class", "select"); 
     elementL.appendChild(document.createTextNode("Wähle Eintrag:")); 

     var elementSel = document.createElement("select"); 
     elementSel.setAttribute("name", "select-keywords-list"); 
     elementSel.setAttribute("id", "select-keywords-list"); 
     elementSel.setAttribute("data-native-menu", "true"); 

     var elementOptD = document.createElement("option"); 
     elementOptD.setAttribute("data-placeholder", "true"); 
     elementOptD.appendChild(document.createTextNode("Wähle Eintrag"));   
     elementSel.appendChild(elementOptD); 

     var allKeywords = $().checkKeywords(results); 

     $.each(allKeywords, function(i, item) { 
      var elementOptAll = document.createElement("option"); 
      elementOptAll.setAttribute("value", item); 
      elementOptAll.appendChild(document.createTextNode(item)); 
      elementSel.appendChild(elementOptAll); 
     }); 

     //alert(elementSel.length()); 

     elementDiv.appendChild(elementL); 
     elementDiv.appendChild(elementSel); 

     var elementDivKey = document.createElement("div"); 
     elementDivKey.setAttribute("id", "keylist"); 

     elementRoot.appendChild(elementDiv); 
     elementRoot.appendChild(elementDivKey); 

     return elementRoot; 
    }; 

比其它部分

      case 'keywords': 

       html = renderItemsKeywords(itemData); 

       $header.find("h1").html("Title"); 
       $content.html(html); 
       $page.page(); 
       $footer.find(":jqmData(role=navbar)").navbar(); 
       $content.find(":jqmData(role=listview)").listview(); 


       $("#select-keywords-list").selectmenu(); 
       $("#select-keywords-list").selectmenu("refresh"); 
       break; 
      } 
      $.mobile.changePage($(this)); 

希望你明白我在做什么