2015-06-04 5 views
1

У меня есть простое приложение javascript, которое выдает некоторую информацию об BLE.jquery design после динамической загрузки

Все работает нормально, но у меня есть некоторые проблемы с JQuery Mobile Library.

Я хочу, чтобы все приложение было простым JQuery Data-Theme = "b". Поскольку List-View создается динамически с помощью функции addDevice, он не работает с JQuery. Когда я пытаюсь выполнить его без команды .append(), он работает - так что с моей JQuery Mobile Library нет проблем. Я также попытался добавить атрибут данных темы с командой .append(), с этим:

$devices.attr("data-theme" , "b"); 

, но до сих пор не работает ..

Ниже приведены из дублей от моего HTML и JavaScript файлы.

HTML:

<ul data-role="listview" class="devices" id="myresult" data-theme="b"></ul> 
    <div data-role="content" id="result"> 
     <script type="text/template" id="device"> 
      <ul data-role="listview" data-theme="b"> 
       <li data-address="{0}"> 
        <h2>{1}</h2> 
        <h2>RSSI: {2}</h2> 
       </li> 
      </ul> 
     </script> 
    </div> 

JavaScript:

function addDevice(address, name, rssi) 
{ 
    for (var i = 1; i<50; i++) 
    { 
     var $devices = $(".devices"); 

     var $check = $devices.find("li[data-address='{0}']".format(address)); 

     if ($check.length > 0) 
      { 
       return; 
      } 
     var template = $("#device").text().format(address, name, rssi); 

     $devices.append(template); 
     window.setTimeout(50000); 

     if (rssi < -90){  
     alert(name + " loses proximity"); 
     } 
    }  
} 

Может быть кто-то имеет представление о том, что случилось с моим кодом ..

+0

У вас есть ошибки на консоли вашего браузера? –

+0

Нет. Вот почему я не понимаю, почему он не работает. –

+0

возможно это может помочь вам http://stackoverflow.com/a/7999724/1113766 –

ответ

0

Я не знаю, что вы хотите достичь здесь. Но вы можете динамически добавлять данные в listview в JQuery Mobile, используя приведенный ниже код.

HTML:

<div data-role="content"> 
<ul data-role="listview" class="devices" id="myresult" data-theme="b"> 
</ul> 
</div> 

Javascript: В очень простой и легкий способ.

function addDevice(address,name,rssi) { 

var result =""; 

for (int i = 1; i<50;i++) { result += '<li>'+address+'<h2> '+name+'</h2>' result +='<h2> RSSI : '+rssi+'</h2>' result +='</li>' } $('#myresult').append(result); } 

Также вы можете проверить ссылку ниже для динамического списка, используя jquery mobile. http://jsfiddle.net/Gajotres/8uac7/

+0

Я могу показать данные в виде списка, он просто не использует тему данных «b». На самом деле он не использует какой-либо дизайн JQuery. Картина будет очень хорошо объясняться, но я не могу показать вам ее здесь. –

+0

Итак, попробуйте $ ('. Ui-page'). Trigger ("create"); или $ devices.append (шаблон) .trigger ("create)"; –

+0

Большое спасибо! Это был ответ. :) –

Смежные вопросы