将 jQuery Mobile CSS 合并到 JavaScript 输出元素中？答案

【问题标题】：Merging jQuery Mobile CSS into JavaScript output elements?将 jQuery Mobile CSS 合并到 JavaScript 输出元素中？
【发布时间】：2013-09-05 15:35:02
【问题描述】：

我有一个带有 3 个输入类型文本/数字元素和一个按钮的小表单。

脚本获取用户单击按钮时输入的值，然后将这些值附加到<ul /> <li /> 列表中。

但是，附加的元素没有 jQuery Mobile CSS 样式。

这是我的Fiddle，您可以在其中看到我一直在处理的代码及其行为方式。

我尝试使用来自This 帖子的一些想法，但无论我如何更改它并添加$(".config").trigger("create");（我在测试时更改了名称以适合我的代码）它只会使button 看起来像jQueryMobile 风格但删除功能不再起作用。

这是代码（如果你不看演示就知道解决方案）：

<input type="text" id="MedNameStren" name="MedNameStren" placeholder="MedName & Strength" />
<input type="number" data-clear-btn="false" id="MedQuantity" name="MedQuantity" min="1" max="50" value ="1" />
<textarea cols="40" rows="4" name="MedDirections" id="MedDiresctions" placeholder="Type any directions written on your prescription for the above medicine." ></textarea>
<input type="button" id="AddScript" data-icon="plus" data-iconpos="right" value="Add New Prescription" />

<ul class="justList"></ul> 

$('#AddScript').click(function(){
var text = '<h2>' + $('#MedNameStren').val() + '</h2>' + 
           '<p><strong>Quantity: </strong>' + $('#MedQuantity').val() + '</p>' +
           '<p><strong>Directions: </strong>' + $('#MedDiresctions').val() + '</p>' +
           '<button>Delete</button>';

    if(text.length){
      $('<li />', {html:text}).appendTo('ul.justList')
    }
});

$('ul').on('click','button' , function(el){
    $(this).parent().remove()
});

另外，如果您能告诉我如果MedNameStren 和MedDirections 为空，如何防止按钮附加新的<li>，那就太好了（微调器将始终显示数字1） . 任何建议或指导将不胜感激！

【问题讨论】：

这回答了你所有的问题jsfiddle.net/Palestinian/LQtYC
非常感谢，这工作正常！ :)
哦，当将它添加到我的项目时，我注意到它只将<button> 更改为 jQueryMobile，但它没有更改<li>，这仍然是标准 CSS。无论如何我可以告诉 JS 采用 jQueryMobile 结构 CSS？
给ul一个属性data-role="listview"。追加新项目后，请致电$('ul').listview('refresh');
你摇滚！非常感谢！现在一切正常:) - 如果你愿意，你可以把你的 cmets 放在一个正确的答案中，这样我就可以勾选/接受它。这样这个问题就可以设置为已回答！ :)

标签： javascript jquery html jquery-mobile

【解决方案1】：

为了将此问题标记为已回答，我想将@Omar 在上面的 cmets 中发布的解决方案放在这里。

这个Fiddle 是由@Omar 编写和提供的，它通过在JS 中添加以下内容真正解决了我的问题：

$('button').button();

比较我的Fiddle 和Omar's 可以看出差异。希望这对任何人都有帮助。

【讨论】：