javascript - 动态加载后的jquery设计

Question

我有一个简单的javascript应用程序，它给出了BLE的一些信息。

一切工作正常，但我在使用 JQuery Mobile Library 时遇到一些问题。

我想要整个应用程序采用简单的 JQuery Data-Theme="b"。由于 ListView 是通过 addDevice 函数动态创建的，因此它不能与 JQuery 一起使用。当我在没有 .append() 命令的情况下尝试它时，它正在工作 - 所以我的 JQuery Mobile Library 没有问题。我还尝试使用 .append() 命令添加 data-theme 属性，如下所示:

    $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");
        }
    }       
}

也许有人知道我的代码有什么问题..

Answer 1

我不知道你想在这里实现什么。但是您可以使用以下代码在 Jquery Mobile 的 ListView 中动态追加数据。

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/