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

最新推荐文章于 2014-09-25 08:45:46 发布

iteye_10465

最新推荐文章于 2014-09-25 08:45:46 发布

阅读量63

点赞数

文章标签： javascript ViewUI

本文介绍使用JQUERY实现客户端与ASP服务器端的数据交互过程。通过选择不同产品选项时，利用JQUERY回调函数动态加载ASP返回的价格信息，并更新页面显示。

学习JQUERY和ASP的数据交互

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

html代码：

<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;" %>