HTML代码
<!doctype html>
<html><head>
<meta charset="utf-8">
<script src="jquery-3.2.1.min.js"></script>
<script src="json2.js"></script>
<script>
$(function(){
//初始化获取列表
$.ajax({
type:'GET',
url:'book_bd.asp',
dataType:"text",
async:false,
//连接json数据并返回数据
success: function(data_list){
var obj_line=$.parseJSON(data_list);
var option="<option value=''>------请选择------</option>"
for(i=0;i<obj_line.length;i++)
{
option=option+"<option value="+i+">"+obj_line[i].BookName+"</option>"
}
$("select[name='book']").html(option)
}
})
//当选择列表时触发查询事件
$("select").change(function(){
//获取当前id
id=$(this).val()
$.ajax({
type:"get",
url:'book_bd.asp',
dataType:"text",
async:false,
success: function(data){
var obj=$.parseJSON(data);
book_info="<br>书籍名："+obj[id].BookName+"<br>剩余数量："+obj[id].BookNum+"<br>单价："+obj[id].BookPrice;
$(".book").html(book_info);
}
})
})
})
</script>
<title>无标题文档</title>
</head>
<body>
<select name="book">
</select>
<div class="book">
</div>
</body>
</html>
数据保存页面
<%
response.Charset="GB2312"
book="Html|javascript|Json|ASP|PHP"
num="100|12|43|93|400"
price="30$|40$|10$|30$|60$"
newBook=split(book,"|")
newNum=split(num,"|")
newPrice=split(price,"|")
b="<br>"
response.Write("[")
for i=0 to ubound(newBook)
response.Write("{")
response.Write("""BookName"""&":"&""""&newBook(i)&""""&",")
response.Write("""BookNum"""&":"&""""&newNum(i)&""""&",")
response.Write("""BookPrice"""&":"&""""&newPrice(i)&"""")
response.Write("}")
if i=Ubound(newBook) then
else
response.Write(",")
end if
next
response.Write("]")
%>
PS：后台我用的是ASP，因为查询时可以实现数据列表通过程序生成格式化文本（json）。
285
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
