您的位置：首页 > Web前端 > JQuery

利用JQUERY的回调函数，通过asp中的代码在客户端执行js。

2009-08-21 14:20 691 查看
学习JQUERY和ASP的数据交互

利用JQUERY的回调函数，通过编写asp中的代码,控制客户端执行相应的js代码。

html代码：

<!--html客户端代码，演示如何调用jquery的回调函数-->

<html>
<head><meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>What's for dinner?</title>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$('#items').change(showItemInfo);
});

function showItemInfo() {
$('div#itemData').load(
'server.asp',
{itemid: $(this).val() },
function(data) { eval(data); }
);
}
</script>
<style type="text/css">
#items
{
height: 270px;
width: 99px;
}
</style>
</head>

<body>
<form style="float:left">
产品:
<select id="items" size="10">
<option value="1">Milk</option>
<option value="2">Cole Slaw</option>
<option value="3">BBQ Sauce</option>
<option value="4">Lunch Meat</option>
<option value="5">Mustard</option>
<option value="6">Hot Sauce</option>
<option value="7">Cheese</option>
<option value="8">Iced Tea</option>
</select>
对应价格:
<select id="Vitems" size="10">
<option value="1">20</option>
<option value="2">30</option>
<option value="3">60</option>
<option value="4">70</option>
<option value="5">15</option>
<option value="6">36</option>
<option value="7">42</option>
<option value="8">36</option>
</select>
</form>
<script language='javascript'>
document.write('价格：index[0]的值<--');
</script>
<script type='text/javascript'>
document.write(document.getElementById('Vitems').options[0].text)
</script>
<div>
<div><label>Item:<div id="item"></div></label></div>
<div><label>Description:</label></div>
<div><label>Quotation:<div id="itemData"></div></label></div>
</div>
<div><label>Category:</label>${eFridge.items[param.id].category}</div>
<div><label>Expires:</label>${eFridge.items[param.id].expires}</div>
</div>
</body>
</html>


asp代码：

<%
Response.ContentType ="text/HTML"

Response.Write "document.getElementById('item').innerHTML= " & request.form("itemid") & ";"
Response.Write "document.getElementById('itemData').innerHTML=document.getElementById('Vitems').options[" & request.form("itemid")-1 & "].text;"
Response.Write "document.getElementById('Vitems').options[" & request.form("itemid")-1 & "].selected = true;"

%>
内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 点击这里给我发消息
标签： 
相关文章推荐
新的分享
章节导航