Question

我想动态添加li标签事件虽然添加

列表视图（＆＃34;刷新＆＃34）;

它似乎不适用于jquery mobile css。我试过了

。
列表视图（）列表视图（＆＃34;刷新＆＃34）;

下面的代码是我写的。请将以下代码保存为tmp.html并尝试使用您的localhost。

在我的环境中，推送ADD btn时没有错误。

<link rel="stylesheet" href="https://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>
<script>
  $(document).bind('mobileinit', function() {
    $.mobile.changePage.defaults.changeHash = false;
    $.mobile.hashListeningEnabled = false;
    $.mobile.pushStateEnabled = false;
  });
</script>
<script src="https://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js"></script>
<script>
  function onAddBtn() {
    $li = $('<li><p>a:</p><input type="text"><p>b:</p><input type="text"></li>');
    $("#SentenceList").append($li).listview("refresh");
  }

  function onReady() {
    $("#AddBtn").click(onAddBtn);
  }

  $(onReady);
</script>
<div data-role="page" id="AddPage">
  <header data-role="header" data-position="fixed" data-theme="b">
    <a data-role="button" data-rel="back" data-icon="back" style="background-color: gray;">Back</a>
    <h1>Add Memo</h1>
  </header>
  <section data-role="content">
    <ul id="SentenceList" data-role="listview">
      <li>
        <p>a:</p>
        <input type="text">
        <p>b:</p>
        <input type="text">
      </li>
      <li>
        <p>a:</p>
        <input type="text">
        <p>b:</p>
        <input type="text">
      </li>
    </ul>
  </section>
  <a data-role="button" data-icon="plus" id="AddBtn">ADD</a>
</div>

Answer 1

刷新列表视图后，您可以告诉jQM增强输入：

$("#SentenceList").append($li).listview("refresh").enhanceWithin();

<强> DEMO

jquery mobile动态添加元素无法正常工作

1 个答案: