CSS-стиль jquery-mobile исчезает при редактировании html через jquery - PullRequest
Новая
       2

CSS-стиль jquery-mobile исчезает при редактировании html через jquery

0 голосов
/ 23 ноября 2011

Я занимаюсь разработкой своего первого jquery-мобильного приложения, и я довольно плохо знаком с веб-разработкой и java-скриптом в целом.

У меня есть следующий html в моем разделе контента: 

        <div data-role="collapsible" data-collapsed="false"  data-content-theme="c">
            <h3>Results</h3>
            <p id="UnitResult"> Results..  </p>
        </div>
        <div data-role="collapsible" data-collapsed="true" data-content-theme="c" >
            <h3 id ="ShowAllh3">Show all</h3>
            <ul id="AllUnitsResult" data-role="listview" data-inset="true" data-theme="d"> 
              <li>list element</li>
              <li>list element 2</li> </ul>
        </div>

У меня также есть <input type="number" .... onchange="calculate()>, и в функции вычисления я делаю следующее (среди прочего): 

$('#UnitResult').html(volume + " " + fromText + " equals " + result + " " + toText + ".");
$('#ShowAllh3').text('test');
for(var i = 0; i < resultArray.length; i++) {
   $('#AllUnitsResult').append('<li class = "number">' + Units[i].name + ': ' + resultArray[i] + '</li>');
}

Проблема, с которой я столкнулся, заключается в том, что стилизация этих элементов меняется, когда я добавляю новые HTML-теги в реальном времени, есть ли способ избежать этого?

Перед вызовом функции:

Before function is called:

После вызова функции:

enter image description here

Вы видите, что новые элементы, добавленные в список, выглядят странно, и заголовок, которыйбыл "Показать все", изменен на "тест", но форматирование пропало ..

1 Ответ

0 голосов
/ 24 ноября 2011

Решена проблема со списком: 

$("#AllUnitsResult").listview("refresh");
...