ICode9

精准搜索请尝试: 精确搜索
首页 > 编程语言> 文章详细

javascript-在jQuery Mobile中将项目动态添加到Listview

2019-11-23 01:34:06  阅读:235  来源: 互联网

标签:jquery-mobile html javascript


在jQuery mobile中将项目动态添加到列表视图时遇到麻烦.基本上,我希望用户在文本框中输入的任何内容都可以添加到列表中.我有以下代码,无法弄清为什么没有出现所需的输出.

<script>
  var listCreated = false;
  function appendToList() {
    if(!listCreated) {
      $("#items").append("<ul id='list' data-role='listview' data-inset='true'></ul>");
      listCreated = true;
      $("#items").trigger("create");
    }
    $("#list").append("<li>");
    $("#list").append(document.getElementById(item).value);
    $("#list").append("</li>");
    $("#list").listview("refresh");
  }
</script>
<div data-role="content">
  <div id="items"></div>
  <input type="text" id="item" />
  <input type="button" value="Add item to list" onclick="appendToList()"/>
</div>

解决方法:

尝试创建整个li,然后追加,现在,您要追加一个< li>到列表,然后是列表的值,而不是新的li

var value = $("#item").val();
var listItem = "<li>" + value + "</li>";
$("#list").append(listItem);

演示:http://jsfiddle.net/DVbGY/1/

标签:jquery-mobile,html,javascript
来源: https://codeday.me/bug/20191123/2064102.html

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有