您现在的位置: 万盛学电脑网 >> 程序编程 >> 脚本专题 >> javascript >> 正文

用JavaScript实现类似于ListBox功能示例代码

作者:佚名    责任编辑:admin    更新时间:2022-06-22

 这篇文章主要介绍了用JavaScript实现类似于ListBox功能,需要的朋友可以参考下

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的功能。