使用jquery mobile创建动态下拉列表

时间:2013-10-28 10:54:00

标签: jquery jquery-mobile jquery-mobile-popup jquery-mobile-ajax jquery-mobile-select

使用jquery mobile

创建下拉列表时,以下代码无法正常工作
   $(function(){
      $('#hello').append('<select id="myselect" data-native-menu="false">'+
     ' <option>1</option>'+
     '<option>2</option>'+
     '<option>3</option>'+
     '<option>4</option>'+
     '<option>5</option>'+
     '<option>6</option>'+
     '</select>'+
     '<div id="keyOpen" style="background-color: blue;"></div>'+
     '<div id="keyClose"></div>');

     $( "#myselect" ).selectmenu( "refresh" );
     $(document).keyup(function(e){
     if(e.which >= 48 && e.which <= 57){
     $("#myselect").selectmenu( "open" );//this should open the select
     $("#keyOpen").empty().text(e.which);
     }else if(e.which >= 58 && e.which <= 90){
     $("#myselect").selectmenu( "close" );//this should close the select
     $("#keyClose").empty().text(e.which);
     }
     });
    }); 

当我将代码放在正文中时,相同的代码工作正常

工作代码:

   <select id="myselect" data-native-menu="false">
     <option>1</option>
     <option>2</option>
     <option>3</option>
     <option>4</option>
     <option>5</option>
     <option>6</option>
  </select>
  <div id="keyOpen" style="background-color: blue;"></div>
  <div id="keyClose"></div>

1 个答案:

答案 0 :(得分:1)

仅在修改现有$(".selector").selectmenu("refresh")时使用select

每当您添加新的select时,请使用$(".selector").selectmenu();进行增强。

  

<强> Demo