Использовать jQuery для замены XMLHttpRequest

Я совершенно новый для библиотек 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 есть хороший способ сделать это?

Ответы

Ответ 1

$.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);
    });
}

Ответ 2

Выньте проверки готовности и состояния. 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);

Ответ 3

Я не думаю, что jQuery реализует функцию таймаута, но простой старый javascript делает это довольно красиво:)

Ответ 4

В соответствии с docs аргументы jQuery.get url, data, callback, а не url, callback.

Вызов функции setTimeout JavaScript в конце вашей функции обратного вызова должен быть достаточным для непрерывного выполнения этого.

Ответ 5

Нет необходимости устанавливать параметры GET на URL, 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;
});

Ответ 6

В конце концов, я предполагаю, что был добавлен тип. Кажется, это работает для меня.

  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();
  }

Спасибо всем за помощь. Я проголосую за вас.