jquery - 将 AJAX 转换为 jQuery

标签 jquery ajax

如何将以下代码转换为仅使用 jquery 库?

<html>
<head>
<script>
function do_it(value)
{
function newXMLHttpRequest()
{
   try{ return new XMLHttpRequest(); }catch(e){}
   try{ return new ActiveXObject("Msxml2.XMLHTTP"); }catch(e){}
   try{ return new ActiveXObject("Microsoft.XMLHTTP"); }catch(e){}
   return null;
}

var ajax_request = false;
ajax_request = newXMLHttpRequest();
var url = "test.pl?b64="+value;
    ajax_request.open("GET",url,1);
    ajax_request.onreadystatechange = function()
    {
        if(ajax_request.readyState == 4)
        {

            var response = ajax_request.responseText;
            document.getElementById("in").innerHTML = response;

        }
    }
    ajax_request.send(null);
}
</script>
</head>
<body>

<form>
<input type="text" name="string" onkeyup="do_it(this.value)"/>
<input type="submit" name="submit">
</form>
<div style="position:absolute;width:200px;height:200px; background-color:yellow; margin-top:100px;" id="in"></div>

</body>
</html>

抱歉,我可能应该提到,我实际上没有任何 jquery 的实际经验,而且我现在正在熟悉它......

最佳答案

看看 jquery load() - 我认为这就是您正在寻找的:

function do_it(value){
  $('#in').load('test.pl', { b64: value });
}

编辑:如果您想要有不同的错误和成功处理程序,请使用 ajax()就像其他人发布的那样,这是可行的方法 - 但对于简单的 get-this-and-put-it-into-that-div-request 来说,load() 更短、更容易。

编辑2:您的评论:最好是以任何方式识别您的输入字段(为其提供一个ID,或为应获取此事件的每个字段提供相同的类)然后简单地做:

$('#mytextfield').keyup(function(){ // with id-selector
  do_it($(this).val());
});

$('.textfield').keyup(function(){ // with class-selector
  // whatever
});

(不是:我没有测试过,只是随心所欲地写下...如果有问题,只需看看 documentation )

关于jquery - 将 AJAX 转换为 jQuery,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/4245853/

相关文章:

Javascript Ajax 调用始终返回readyState=1 和status=0

jquery - 使用 Twitter Bootstrap 时出现 Iframe 错误

jquery - 向下移动所选选项不可见

javascript - 获取输入值并将其用作 JS/jQuery 的数组

php - list() 函数和 mysqli_fetch_array 一起工作吗?

ajax - 基于Ajax的应用程序,并希望在 session 过期后重定向到登录页面

jquery - ASP.NET MVC3 清晰表单

php - Ajax 和 Internet Explorer

javascript - bootstrap-multiselect 选项太长,超出容器

javascript - IE8 - 视差内容 slider 自动播放问题