这里要讲的是jqueryMobile 中的ListView 动态的列表

  1. <ul data-role="listview" data-inset="true" id="uiList">
  2. </ul>
  3. </body>
  4. </html>
  5. <script type="text/javascript">
  6.  
  7. $(document).ready(function () {
  8. InitDataBind();
  9. });
  10.  
  11. function InitDataBind() {
  12. var dataLi = $("#uiList");
  13. $.ajax({
  14. type: "POST",
  15. url: "/ajax/Test_News.ashx?date=" + new Date().getTime(),
  16. data: "",
  17. dataType: "json",
  18. success: function (data) {
  19. data = eval(data);
  20. var listHtml = "";
  21. listHtml += "<li data-role='list-divider' data-theme='g'>今天是:2013年10月11日<span class='ui-li-count'>2</span></li>";
  22. $.each(data.Test_News, function (i, item) {
  23. listHtml += "<li>";
  24. listHtml += "<a href='#'>";
  25. listHtml += "<img src='/Img/2.jpg'>";
  26. listHtml += "<h2>" + item.username + "</h2>";
  27. listHtml += "<p>" + item.usercontent + "</p>";
  28. listHtml += "<p class='ui-li-aside'><strong>" + item.userdate + "</strong></p>";
  29. });
  30. dataLi.html(listHtml.replace("undefined", ""));
  31. <span style="color:#FF0000">$("#uiList").listview('refresh'); // 重要 </span>
  32. },
  33. error: function (data) {
  34. dataLi.append("数据有误!");
  35. }
  36. });
  37. }
  38. </script>

jquerymobile知识点:动态ListView的更多相关文章

  1. Android:仿手机QQ朋友动态ListView

    1.介绍: 使用此博客XListView模仿Android版本QQ朋友动态ListView效果.效果如下面的截图: watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZ ...

  2. jquerymobile知识点:动态Grid的绑定以及刷新

    下面jquerymobile是ajax动态绑定和刷新的例子.直接上图以及代码. 下面是实例代码: //初始绑定 function GetInitBind(PageIndex, PageSize, sq ...

  3. jquerymobile知识点:select的动态帮定

    代码: <div data-role="navbar"> <ul> <li> <select name="select-choi ...

  4. 22、(转载)jQueryMobile 知识点总结

    本文转自:http://www.cnblogs.com/jxyedu HTML5技术生态介绍 H5的现状与未来 HTML5是用于取代1999年所制定的 HTML 4.01 和 XHTML 1.0 标准 ...

  5. jquerymobile知识点:button与a

    首先先上一段代码: <a href="#" data-role="button" onclick="change();" id=&qu ...

  6. javascriptDOM编程艺术_学习笔记_知识点 动态创建标记

    传统技术:document.write 和 innerHTML 深入剖析DOM方法:createElement.createTextNode.appendChild 和 insertBefore   ...

  7. jquerymobile知识点:实现toolbar下方显示,自定义图标!

    css: .nav-glyphish-example .ui-btn .ui-btn-inner { padding-top: 40px !important; } .nav-glyphish-exa ...

  8. jquerymobile知识点三:弹出层popup

    弹出层popup很简单,主要就是弹出验证,登陆注册,提交信息之类的,下面是我写好的一个demo... <div data-role="popup" id="popu ...

  9. Listview 加载更多

    JQM Listview 加载更多 demo - Warren的个人主页 JQM Listview 加载更多 Demo 测试数据1 测试数据2 测试数据3 测试数据4 显示更多 Page Footer ...

随机推荐

  1. VMware网络选项分析

    摘自资料:VMware网卡选项分析.zip 很多朋友都曾问到关于Guest和Host互联,其实这并不是一件困难的事情,只要能够理解VMware的网络模型即可,今天结合着我的虚拟机,来详细介绍一下VMw ...

  2. spirng MVC乱码过滤器

    <filter> <filter-name>characterEncodingFilter</filter-name> <filter-class>or ...

  3. Java多线程初学者指南(12):使用Synchronized块同步变量

    我们可以通过synchronized块来同步特定的静态或非静态方法.要想实现这种需求必须为这些特性的方法定义一个类变量,然后将这些方法的代码用synchronized块括起来,并将这个类变量作为参数传 ...

  4. WEB SSH之Shellinabox

    用起来方便的,参考URL: http://lzw.me/a/shellinabox.html 生成 pem 证书,可以 https 方式启动.pem 证书的格式为公钥加私钥,并以 x509 的格式进行 ...

  5. eclipse提交本地项目到github

    1.在https://github.com   new repository 2.在eclipse中new project  比如:Test项目 3.右击"Test"->Te ...

  6. HTML图片热点、网页划区、拼接、表单

    一.图片热点: 规划出图片上的一个区域,可以做出超链接,直接点击图片区域就可以完成跳转的效果. 示例: 二.网页划区: 在一个网页里,规划出一个区域用来展示另一个网页的内容. 示例: 三.网页的拼接: ...

  7. Android用户界面 UI组件--ImageView及其子类ImageButton,QuickContactBadge附带Draw9Patch工具说明

    1.ImageView 常用属性: android:src 设置可绘制对象作为 ImageView 显示的内容 android:cropToPadding 如果设置为true,图片裁剪到保留该Imag ...

  8. Android-获取外置SDcard路径

    Android手机支持SDcard.目前很多手机厂商把SDcard集成到手机中,当然有的手机同时也支持可插拔的SDcard.这就有了内置SDcard和位置SDcard之分.当手机同时支持内置和外置SD ...

  9. sudo easy_install MySQL-pythonubuntu常用命令

    修改密码 sudo passwd root 安装openssh-server sudo apt-get install openssh-server 安装easy_install sudo wget ...

  10. C# WinForm窗体界面设置问题

    设置方法: 一:Form对象 属性: 设计中的Name:窗体类的类名AcceptButton:窗口的确定按钮CancelButton:窗口按ESC的取消按钮 1.外观 Backcolor:背景颜色Fo ...