在 Jquery/Javascript 中检查 URL

Question

我只需要一个在 URL 响应时返回 true 的方法。不幸的是，我是 jQuery 新手，它让我编写该方法的尝试相当令人沮丧。

我已经看到了几个使用 .ajax 的 jQuery 示例，但我的代码一直失败。怎么了？

var urlExists = function(url){
    //When I call the function, code is still executing here.
    $.ajax({
        type: 'HEAD',
        url: url,
        success: function() {
            return true;
        },
        error: function() {
            return false;
        }            
    });
    //But not here...
}

Answer 1

这不是 AJAX 的工作方式。 AJAX 本质上是异步的（这实际上是第一个 'A' 所代表的），这意味着您调用一个函数并传入一个回调，而不是调用一个函数并返回一个值，然后将使用该值调用该回调.

（见http://en.wikipedia.org/wiki/Continuation_passing_style。）

在知道 URL 是否响应后，您想做什么？如果您打算像这样使用此方法：

//do stuff
var exists = urlExists(url);
//do more stuff based on the boolean value of exists

那么你要做的就是：

//do stuff
urlExists(url, function(exists){
  //do more stuff based on the boolean value of exists
});

urlExists() 在哪里：

function urlExists(url, callback){
  $.ajax({
    type: 'HEAD',
    url: url,
    success: function(){
      callback(true);
    },
    error: function() {
      callback(false);
    }
  });
}

Answer 2

urlExists()无法返回，因为它需要等待请求。

要么给它一个回调，要么让它同步（不推荐，因为它会锁定浏览器）。

var urlExists = function(url, callback) {

    if ( ! $.isFunction(callback)) {
       throw Error('Not a valid callback');
    }   

    $.ajax({
        type: 'HEAD',
        url: url,
        success: $.proxy(callback, this, true),
        error: $.proxy(callback, this, false)      
    });

};

那你就可以了

urlExists('/something', function(success) {
    if (success) {
        alert('Yay!');
    } else {
        alert('Oh no!');
    }
});

还值得一提的是same origin policy。

此外，从父函数中的匿名函数范围 will not return 返回（如您的原始示例中）。它只是返回那个内部函数。要从内部返回到父级，设置一个标志并返回它。

Answer 3

基本上，您的代码没有任何问题。在这里看到它的工作： http://jsfiddle.net/PK76X/

我的猜测是您正在使用它来检查不同域上内容的可用性，但由于浏览器不允许跨域 ajax 请求而失败。

Answer 4

如果网址与您的页面来自同一个域，您可以这样做。但如果它来自不同的域，例如 google.com，那么由于跨域安全性，它将失败。

Answer 5

一般来说，您可能应该使用 firebug 插件在 Firefox 中运行您的脚本。它将为您提供解决问题所需的详细信息。

ajax 和 post 方法是异步的，所以你应该在回调方法中处理结果。

Answer 6

AJAX 基本上是异步的，这就是您所描述的行为的原因。 我使用了以下无跨源代码，以同步方式获得一个简单的真/假指示 URL 是否有效：

function isValidURL(url) {
    var encodedURL = encodeURIComponent(url);
    var isValid = false;

    $.ajax({
      url: "http://query.yahooapis.com/v1/public/yql?q=select%20*%20from%20html%20where%20url%3D%22" + encodedURL + "%22&format=json",
      type: "get",
      async: false,
      dataType: "json",
      success: function(data) {
        isValid = data.query.results != null;
      },
      error: function(){
        isValid = false;
      }
    });

    return isValid;
}

那么用法就很简单了：

var isValid = isValidURL("http://www.wix.com");
alert(isValid ? "Valid URL!!!" : "Damn...");

希望对你有帮助