使用jQuery替换XMLHttpRequest
时间:2020-03-06 14:27:14 来源:igfitidea点击:
我对JavaScript库很陌生。我想用jQuery替换当前代码。我当前的代码如下所示:
var req;
function createRequest() {
var key = document.getElementById("key");
var keypressed = document.getElementById("keypressed");
keypressed.value = key.value;
var url = "/My_Servlet/response?key=" + escape(key.value);
if (window.XMLHttpRequest) {
req = new XMLHttpRequest();
} else if (window.ActiveXObject) {
req = new ActiveXObject("Microsoft.XMLHTTP");
}
req.open("Get", url, true);
req.onreadystatechange = callback;
req.send(null);
}
function callback() {
if (req.readyState == 4) {
if (req.status == 200) {
var decimal = document.getElementById('decimal');
decimal.value = req.responseText;
}
}
clear();
}
我想用比jQuery更友好的代码替换我的代码
$.get(url, callback);
但是,它不会调用我的回调函数。
我也想连续调用一个名为createRequest的函数。 jQuery有这样做的好方法吗?
解决方案
我不认为jQuery实现了超时功能,但是普通的旧javascript相当不错:)
根据文档,jQuery.get的参数是" URL,数据,回调",而不是" URL,回调"。
在回调函数末尾调用JavaScript的setTimeout函数足以使此函数连续执行。
$.get(url, {}, callback);
应该做到的。回调可以这样简化:
function callback(content){
$('#decimal').val(content);
}
甚至更短:
$.get(url, {}, function(content){
$('#decimal').val(content);
});
总而言之,我认为这应该可行:
function createRequest() {
var keyValue = $('#key').val();
$('#keypressed').val(keyValue);
var url = "/My_Servlet/response";
$.get(url, {key: keyValue}, function(content){
$('#decimal').val(content);
});
}
取出readyState和状态检查。 jQuery仅在成功时调用回调。回调函数提供了参数(data,textStatus),因此我们应使用data而不是req.responseText。
另一个答案建议的window.setTimeout()不会做我们想要的,只是等待然后调用一次函数。我们需要改用window.setInterval(),它将定期调用函数,直到我们取消它。
因此,总而言之:
var interval = 500; /* Milliseconds between requests. */
window.setInterval(function() {
var val = $("#key").val();
$("#keypressed").val(val);
$.get("/My_Servlet/response", { "key": val }, function(data, textStatus) {
$("#decimal").val(data);
});
}), interval);
无需在URL上设置GET参数,jQuery会自动设置它们。试试下面的代码:
var key = document.getElementById("key");
[...]
var url = "/My_Servlet/response";
$.get (url, {'key': key}, function (responseText)
{
var decimal = document.getElementById ('decimal');
decimal.value = responseText;
});
最后,我想它是添加的类型。这似乎为我工作。
function convertToDecimal(){
var key = document.getElementById("key");
var keypressed = document.getElementById("keypressed");
keypressed.value = key.value;
var url = "/My_Servlet/response?key="+ escape(key.value);
jQuery.get(url, {}, function(data){
callback(data);}
, "text" );
}
function callback(data){
var decimal = document.getElementById('decimal');
decimal.value = data;
clear();
}
谢谢大家的帮助。我会投票给你。

