Правильное редактирование веб-интерфейса с Tizen - PullRequest
Новая
       17

Правильное редактирование веб-интерфейса с Tizen

0 голосов
/ 12 ноября 2018

Я пытаюсь создать веб-приложение Tizen для носимых устройств с использованием TAU.У меня есть этот список: 

<ul class="ui-listview" id="nearbyList">
        <li class="ui-listview-divider">Nearby</li>


        <li class="li-has-multiline li-has-thumb-left">
                <a href="contents/place1.html">Place 1
                <span class="ui-li-sub-text li-text-sub">Info 1</span>
                <span class="ui-li-sub-text li-text-sub">xxxx</span>
                <img src="../../../css/images/place1.png" class="ui-li-thumb-left">
                </a>
        </li>

        <li class="li-has-multiline li-has-thumb-left">
                <a href="index-old.html">Open Elements
                <span class="ui-li-sub-text li-text-sub">xxxx</span>
                <span class="ui-li-sub-text li-text-sub">xxxx</span>
                <img src="../../../css/images/open.png" class="ui-li-thumb-left">
                </a>
        </li>

    </ul>

, который мне нужно отредактировать с помощью JS с данными, которые я получаю из Интернета.Проблема в том, что когда я пытаюсь редактировать список с помощью JQuery, он, кажется, не работает и вместо этого отображает новые элементы за существующим списком.Используя меню отладчика в Tizen Studio, я вижу, что TAU сильно редактирует HTML, в результате чего мой #nearbyList не содержит элементы, которые я указал выше, поэтому JQuery добавляет его, а TAU не подтверждает его и обновляет соответствующим образом.

Это код, который я пытаюсь использовать для добавления элементов в список: 

$('#nearbyList').append('<li class=\"ui-li-grid\"> <div>Finding Location</div> <div class=\"ui-processing\"></div></li>');//processing animation

, который вместо этого отображает это:

image

Вот как я инициализирую свои скрипты: 

<script src="lib/jquery.min.js"></script>
<script src="js/circle-helper.js"></script>

<script src="js/app.js"></script>
<script src="js/lowBatteryCheck.js"></script>
<script src="lib/tau/wearable/js/tau.js"></script>
<script src="lib/jsSHA/sha1.js"></script>
<script src="js/web.js"></script>
<script src="js/location.js"></script>

Любая помощь в том, как правильно использовать JQuery с TAU для добавления элементов в список, будет отличной.

Спасибовы.

1 Ответ

0 голосов
/ 13 ноября 2018

Вы можете просто использовать JS, чтобы добавить элемент в список. Я создал каждый элемент, как показано ниже, и добавил цикл. 

UL = document.getElementById("list");
li = document.createElement("LI");
var textnode = document.createTextNode("Title");
li.appendChild(textnode);
nodeA = document.createElement("A");
var textnode2 = document.createTextNode("Link");
nodeA.appendChild(textnode2);
span = document.createElement("SPAN");
var textnode3 = document.createTextNode("Content");
span.appendChild(textnode3);
li.appendChild(nodeA);
li.appendChild(span);
UL.appendChild(li);

Это не будет нарушать ваш список TAU.

...