Ajax HacksHack6 接收数字数据.docVIP

Ajax Hacks-Hack6 接收数字数据 本Hack以数字形式接收股票价格，然后和用户输入处理以后显示出结果。如果服务器没有返回正确的数字，程序会显示错误信息。 Ajax技术的一个巨大进步就是从服务器接收不连续的数据，而不是整个页面。有时，这些不连续信息不得不作为一个数字，而不是作为一个字符串（就像上一个Hack讲的那样）或者其他对象。JavaScript能够很容易的将其他各式的数据转换成数字而不需要用户的干预，但尽管如此，用户还是不想从服务器得到一些奇怪的数据（需要格式检查）。 本hack检查用户输入的“股票的股数”的格式为一个正确的数字格式。然后从服务器接收股票的价格。然后动态显示出处理的结果。 Figure 1-6 浏览器显示图 Figure 1-6. 显示总量 一下是页面的HTML代码： “/TR/1999/REC-html401strict.dtd” Your total Stock Holdings 窗体顶端 javascript:void%200“getStockPrice(this.stSymbol.value,this.numShares.value);return false” Enter stock symbol: Enter share amount: Get Total Value 当用户点击Get Total Value按钮，动作引发表单元素的提交事件。getStockPrice函数用来处理事件。函数取得股票符号以及股票数量作为参数。The return false part of the event-handling code cancels the browser’s typical submission of the form values to the URL specified by the form tag’s action attribute. 窗体底端 下面是hack4.js文件的代码： var request;var symbol; //保存股票代码var numberOfShares; function getStockPrice(sym,shs){if(sym shs){symbol=sym;numberOfShares=shs;var url=“/s/stocks?symbol=”+sym;　 httpRequest(“GET”,url,true);}}//event handler for XMLHttpRequestfunction handleResponse( ){if(request.readyState == 4){alert(request.status);if(request.status == 200){/* Check if the return value is actually a number. If so, multiple by the number of shares and display the result */var stockPrice = request.responseText;try{if(isNaN(stockPrice)) { throw new Error(“The returned price is an invalid number.”;}if(isNaN(numberOfShares)) { throw new Error(“The share amount is an invalid number.”;}var info = “Total stock value: ”+ calcTotal(stockPrice);displayMsg(document.getElementById(“msgDisplay“,info,“black”;document.getElementById(“stPrice“.style.fontSize=“0.9em”;document.getElementById(“stPrice“.innerHTML =”price: ”+stockPrice;} catch (err) {displayMsg(document.getElementById(“msgDisplay”,“An error occurred: ”+err.message,“red”;}} else {alert(“A problem occurred with communicating between the ”+“XMLHttpR