0

我的html代码是:

<div class="ui-widget photo">
    <div class="ui-widget-header ui-corner-all">
         <h2>St. Stephen's Cathedral</h2>

         <h3><a href="http://maps.google.com/maps?q=vienna,+austria&amp;z=11" data-geo="data-geo">Vienna, Austria</a></h3>

    </div>
    <div id="result"></div>
</div>

我的 Javascript 代码是:

$(function () {
    $(document).tooltip({
        items: "[href]",
        content: function () {
            var element = $(this);
            if (element) {
                var text = element.text();
                var link = element.attr('href');
                // alert(link);
                return "<img class='map' alt='" + text +
                    "' src='http://maps.google.com/maps/api/staticmap?" +
                    "zoom=11&size=350x350&maptype=terrain&sensor=false&center=" +
                    "Vienna, Austria" + "'>";

            }

        }
    });
});

这件事在这里给出:

jQuery 工具提示

但现在我想从另一个 url 加载另一个页面说:www.google.com在这个工具提示中。

我正在做的是:

我将.load()函数放在此内容部分中,以便我可以获得响应 html 并将其返回到工具提示中

这是我的代码,但它不起作用我没有得到任何回应......

$(function () {
    $(document).tooltip({
        items: "[href]",
        content: function () {
            $('#result').load('http://stackoverflow.com/', function (response, status, xhr){
                var responseText = response;

            });
            var element = $(this);
            if (element) {
                var text = element.text();
                var link = element.attr('href');
                // alert(link);
                return responseText;

            }

        }
    });
});
4

2 回答 2

1

$.load('http://stackoverflow.com');

不会返回任何内容,因为您正在尝试加载另一个网站。这与 AJAX 的工作方式背道而驰。

来自 jQuery 文档

.load() 方法与 $.get() 不同,它允许我们指定要插入的远程文档的一部分。

出于安全原因,它允许用户在同一域上加载文件,而不是外部域。
如果您在打开 firebug 的情况下观察到这个小提琴,您可以看到调用将返回标头200 OK,但由于这些限制而不会加载任何内容。

要实现您想要的,您可以制作一个获取所需页面的本地文件,然后对其进行 ajax 调用,而不是直接调用网站。


使用本地 php 文件获取页面的简单示例。创建一个本地文件,我会调用它foo.php

<?php
   echo file_get_contents($_GET['url']); 
   // this will echo contents of given url
?>

请注意,这只是一个示例代码,不适合认真使用

然后像这样调用它

$("#container").load("foo.php?url=google.com");

于 2013-07-05T06:43:21.957 回答
0

这是因为您正在尝试发出CORS(跨域资源共享)请求。并且由于安全问题,浏览器和服务器不会接受此类请求,除非服务器返回Access-Control-Allow-Origin带有其可接受的请求域的标头。

要知道什么时候CORS开始发挥作用,请阅读:http ://en.wikipedia.org/wiki/Same_origin_policy#Origin_determination_rules

要了解更多信息,CORS请阅读以下文章http://www.html5rocks.com/en/tutorials/cors/

要测试服务器是否支持CORS,您可以使用以下网站:http ://client.cors-api.appspot.com/client

另一种方法是PHP proxy在您的服务器上创建一个,然后CORS通过该代理发出请求。

这是创建自己的 PHP 代理的教程http://jquery-howto.blogspot.in/2009/04/cross-domain-ajax-querying-with-jquery.html

于 2013-07-05T07:01:30.130 回答