JavaScript对于多项数据的请求和处理过程中，如何实现常常困扰很多程序员，如何进行动态编辑和删除而不影响其他的数据项，今天介绍一种方法，可供借鉴，例如通过XmlRequest请求到如下数据:
复制代码 代码如下:
<span style="font-size:14px;">{ "Table":
[
{ "Id": 3, "Type": "X",
"Content": "党的十八大报告指出，我国人民民主的重要形式是什么？",
"Akey": "基层民主政治制度", "Bkey": "人民代表大会制度",
"Ckey": "多党合作制度", "Dkey": null, "NUM": 3 },
{ "Id": 2, "Type": "X", "Content": "藏羚羊是国家一级保护动物是（）特有动物",
"Akey": "青藏高原", "Bkey": "新疆",
"Ckey": "青海", "Dkey": null, "NUM": 2 },
{ "Id": 1, "Type": "X", "Content": "保护野生动物有很多意义，不属于其意义的是",
"Akey": "环境效应", "Bkey": "文化价值",
"Ckey": "观赏价值", "Dkey": null, "NUM": 1 }
]
}</span>
如何对在HTML中他们进行显示，并实现编辑和删除工作，这里面涉及的json解析和数据分层显示：
HTML显示标签：
<ul id="msg" name="msg"> </ul>
JavaScript解析数据并显示：
复制代码 代码如下:
<span style="font-size:14px;"> var response = xmlHttp.responseText;
eval("var result =" + response);
var len = result.Table.length;
if (len > 0) {
var msg = "";
for (var i = 0; i < len; i++) {
msg += "<li><span>" + result.Table[i].Content + "</span>";
msg += "<span>" + result.Table[i].Akey + "</span>";
msg += "<span>" + result.Table[i].Bkey + "</span>";
msg += "<span>" + result.Table[i].Ckey + "</span>";
msg += "<span>" + result.Table[i].Dkey + "</span>";
msg += "<a href='###' onclick=\"editSub('" + result.Table[i].Id + "')\">编辑</a>";
msg += " <a href='###' onclick='Delete(" + result.Table[i].Id + ")'>删除</a>";
msg += "</li>";
}
document.getElementById("msg").innerHTML = msg;
}</span>
通过editSub(id)和Delete(id) 函数可以多每条数据进行处理，实现类似于ListBox的功能。
您可能感兴趣的文章:
- JS ListBox的简单功能实现代码
- js 获取Listbox选择的值的代码
- javascript实现listbox左右移动实现代码
- 使用javascript实现ListBox左右全选,单选,多选,全请
- JavaScript如何从listbox里同时删除多个项目
- JavaScript控制两个列表框listbox左右交换数据的方法
- 轻松使用jQuery双向select控件Bootstrap Dual Listbox
- jquery控制listbox中项的移动并排序
- 基于JQUERY的两个ListBox子项互相调整的实现代码
- jquery控制listbox中项的移动并排序的实现代码
- jquery移动listbox的值原理及代码
- JS与jQuery实现ListBox上移,下移,左移,右移操作功能示例
