【问题标题】:Get URL content using jquery使用 jquery 获取 URL 内容
【发布时间】:2015-11-16 17:55:19
【问题描述】:

我正在使用jquery 读取本地文件的内容,我得到undefined

我觉得这个问题与 URL 加载的同步有关。但我不知道如何修复此代码:

function url_content(url)
{
    var content;
    $.get(url,function( data ) {content=data});
    return content;
}


var content=url_content("local_templates/template1.html");
alert(content);

【问题讨论】:

    标签: javascript jquery url curl


    【解决方案1】:

    这是因为 javascript 的异步特性。您必须等待数据返回才能使用它。你需要做这样的事情:

    function url_content(url){
        return $.get(url);
    }
    
    
    url_content("local_templates/template1.html").success(function(data){ 
      alert(data);
    });
    

    或者只是

    $.get("local_templates/template1.html").success(function(data){ 
      alert(data);
      doSomeStuffWithTheResult(data);
    });
    
    
    function doSomeStuffWithTheResult(content) {
      // code that depends on content goes here...
    }
    

    如果你绝对必须保持同步,你可以这样做(不推荐)

    function getRemote(remote_url) {
        return $.ajax({
            type: "GET",
            url: remote_url,
            async: false
        }).responseText;
    }
    

    jQuery: Performing synchronous AJAX requests

    【讨论】:

    • 进程的继续需要结果。如何在数据准备好之前停止执行其余命令?顺便说一句,网址是本地的,我不用担心等待。
    • 谢谢,但是有什么办法可以将等待进程放入函数中以停止打扰程序员?
    • 您以前可以设置async: false,但我认为这已被弃用,所以我不会这样做。回调在 javascript 中非常常见,尤其是在 ajax 中,最好接受它们而不是与之抗争。
    • 我不习惯写js。我用PHPC++ 编写程序。这样的过程对我来说很奇怪。我在寻找类似于CURL
    • 有什么理由避免synchronous AJAX?您是否担心页面挂起?
    【解决方案2】:

    异步与同步

    “Ajax”中的“A”表示“异步”。这个词的潜在含义对我来说很难理解,我知道熟悉它可能需要一些时间,但它是现代 Web 开发和一般计算中的一个关键主题,因此值得付出一点努力。

    大多数情况下,您的代码以同步方式运行,因此您不必担心您的环境是否已准备好。考虑到下面的代码,很明显“v”在你需要的时候就可以使用了,你不必等待它被初始化。

    var v = 1;     // no delay during initialization
    var u = v + 1; // you can use "v" immediately
    

    即使此时有延迟,同步处理也会在执行下一行之前等待指令完成。因此,您可以确定“v”会在您需要时准备就绪。现在,让我们看看如果我们引入一个异步任务,这段代码会如何表现。

    function ajax (url) {
        // 1. go to url asynchronously
        // 2. bring back the value
        // 3. return the value
    };
    var v = ajax('mywebsite.com'); // undefined
    var u = v + 1; // "v" is not ready -> NaN
    

    任务的编号方式反映了你的想法,但它不正确,实际上 3 发生在 2 之前。粗略地说,ajax() 不会足够快地获得值并在第一个任务完成之前返回,因此,该值不可用,程序失败。

    更准确地说,只要调用ajax(),程序就会开始与远程计算机通信。这样的任务可以持续几秒钟,但程序知道它的异步特性,因此它不会等待结果并立即跳转到下一行。

    现在我认为您应该更好地了解发生了什么。要点是程序不一定在单个流程中执行,可能会有一些任务与其余任务分开执行,并行。如果您仍然感到困惑,请花点时间考虑一下,然后再进一步:-)

    如何处理异步任务?

    那么,如何避免在执行异步任务时让程序崩溃?使用回调。回调是一个函数,它作为参数传递给另一个函数并在内部调用。让我们看看如何使用回调修复之前的代码块:

    function ajax (url, callback) {
        // 1. go to url asynchronously
        // 2. bring the value
        // 3. when previous tasks done, do callback(value)
    };
    ajax('mywebsite.com', function (value) {
        var v = value;
        var u = v + 1;
    });
    

    要完全理解它的工作原理,您需要知道有一个内部机制充当您的程序和远程计算机之间的中间人。一旦远程计算机的响应可用,该机制就会调用回调函数。

    好吧,我想现在就够了,我不会再打扰你了;-) 详细信息你应该浏览jQuery's docs on Ajax,它可能是一个很好的起点。作为结论,这是ajax() 的可能实现(不是防弹的)。享受吧。

    function ajax (url, callback) {
        var req = new XMLHttpRequest();
        req.open('GET', url, true); // true = asynchronous
        req.onload = function () {
            var value = JSON.parse(this.responseText);
            callback(value);
        };
        req.send(null);
    }
    

    其他内容(点击放大)

    同步:主流程在远程查询期间暂停。

    异步:主要流程在远程查询期间继续进行。

    【讨论】:

      【解决方案3】:

      “.success”可能不起作用并导致错误,请尝试使用“.then”:

        var url="local_templates/template1.html";
        $.get(url).then(function(data){ alert(data); });
      

      【讨论】:

        猜你喜欢
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 2014-03-26
        • 1970-01-01
        • 2011-04-05
        • 1970-01-01
        • 1970-01-01
        相关资源
        最近更新 更多