通过javascript插入元素，而不会丢失jquery移动样式页面

Insert elements by javascript without losing jquery mobile style page

本文关键字：jquery 移动 样式 插入 javascript 元素 通过      更新时间：2023-09-26

我需要通过从数据库接收的数据动态创建一组复选框。我正在使用JavaScript创建复选框。但是当我将它们放在我的页面中时，它们没有jquery移动主题。

在javascript中，我正在编写整个标签（例如 

"<input class='name' data-theme='a' type='checkbox' data-iconpos='right' style='text-align:left' '><label for='checkbox2'>"+ sessionStorage.name + "</label>";

sessionStorage.name有我从数据库中收到的数据。

谢谢。

您必须刷新它们。 

checkboxradio("refresh");

查看此处了解更多信息

更新

以上适用于 1.2.1 版。最新版本具有处理这种情况的更通用方法。在这里查看

jQuery Mobile无法知道您何时将内容注入 页。让 jQuery Mobile 知道您已经注入了必须 增强，您需要确保插件被调用 增强父容器上的新元素或触发器（"创建"） 因此，您不必手动调用每个插件。

创建与刷新：重要区别

请注意，创建事件之间存在重要差异 和某些小部件具有的刷新方法。创建事件适合 用于增强包含一个或多个小部件的原始标记。这 刷新方法应用于现有（已增强的）小部件 已以编程方式操作并需要更新 UI 来匹配。

更新 2

<!DOCTYPE html>
<html>
<head>
<link href="http://code.jquery.com/mobile/latest/jquery.mobile.css" rel="stylesheet" type="text/css" />
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script src="http://code.jquery.com/mobile/latest/jquery.mobile.js"></script>
<meta charset=utf-8 />
<title>JS Bin</title>
</head>
<body>
  <form id="chamada_item">
    <label>
        <input type="checkbox" name="checkbox-0 ">Static
    </label>
  </form>
  <script>
    $(document).ready(function() {
        $('<label><input type="checkbox" name="checkbox-0 ">Dynamic with trigger create</label>').appendTo("#chamada_item").trigger("create");
        $('<label><input type="checkbox" name="checkbox-0 ">Dynamic without trigger</label>').appendTo("#chamada_item");
    });
  </script>
  </body>
</html>
相关文章：