Zaloguj się

heavy1123 · 12-07-2012, 02:55

Witam,
Mam stronę index.html z skryptem .load(), która wygląda tak:

Kod:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"

    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html>

    <head>

        <meta http-equiv="Content-type" content="text/html; charset=utf-8" />

        <title>Test - pobieranie</title>

        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript" charset="utf-8"></script>

        <script type="text/javascript" charset="utf-8">

        $(document).ready(function(){

            $('#list').load("Content.html ul");

        });

        </script>

    </head>

    <body>

        <h2>Here is the list from the other page:</h2>

        <div id="list"></div>

    </body>

</html>

I strona ta wyświetla <ul> z strony Content.html. Wszystko działa pięknie i prawidłowo. Ale gdy Content.html umeiszczę na zewnętrznym serwerze, to wtedy na IE wyświetla sie poprawnie, a Mozilla/Safari/Chrome już wtedy tego nie widzą. Jak rozwiązać ten problem ?

heavy1123 · 15-07-2012, 03:37

Nie do końca o to mi chodziło, gdyż chcę wyświetlić sobie stronę, któa jest lokalnie (http://192.168.0.180/1.html). Znalazłem w internecie kod wykorzystujący YQL do wyświetlania stron z innych serwerów, ale niestety nie obsługuje on stron lokalnych :/. Jak to przerobić/zmienić ?

jquery.xdomainajax.js

Kod:
/**

 * jQuery.ajax mid - CROSS DOMAIN AJAX 

 * ---

 * @author James Padolsey (http://james.padolsey.com)

 * @version 0.11

 * @updated 12-JAN-10

 * ---

 * Note: Read the README!

 * ---

 * @info http://james.padolsey.com/javascript/cross-domain-requests-with-jquery/

 */

jQuery.ajax = (function(_ajax){

    var protocol = location.protocol,

        hostname = location.hostname,

        exRegex = RegExp(protocol + '//' + hostname),

        YQL = 'http' + (/^https/.test(protocol)?'s':'') + '://query.yahooapis.com/v1/public/yql?callback=?',

        query = 'select * from html where url="{URL}" and xpath="*"';

    function isExternal(url) {

        return !exRegex.test(url) && /:\/\//.test(url);

    }

    return function(o) {

        var url = o.url;

        if ( /get/i.test(o.type) && !/json/i.test(o.dataType) && isExternal(url) ) {

            // Manipulate options so that JSONP-x request is made to YQL

            o.url = YQL;

            o.dataType = 'json';

            o.data = {

                q: query.replace(

                    '{URL}',

                    url + (o.data ?

                        (/\?/.test(url) ? '&' : '?') + jQuery.param(o.data)

                    : '')

                ),

                format: 'xml'

            };

            // Since it's a JSONP request

            // complete === success

            if (!o.success && o.complete) {

                o.success = o.complete;

                delete o.complete;

            }

            o.success = (function(_success){

                return function(data) {

                    if (_success) {

                        // Fake XHR callback.

                        _success.call(this, {

                            responseText: data.results[0]

                                // YQL screws with <script>s

                                // Get rid of them

                                .replace(/<script[^>]+?\/>|<script(.|\s)*?\/script>/gi, '')

                        }, 'success');

                    }

                };

            })(o.success);

        }

        return _ajax.apply(this, arguments);

    };

})(jQuery.ajax);

main.js

Kod:
$(document).ready(function() {

  $.get('http://192.168.0.180/1.html', function(res) { //get the html source of this website

    $(res.responseText).find('div').each(function() { //loop though all h3 in the snippets list

      var anchor2 = $(this).children('input'); //get the actual link with the text inside

      jQuery('<d/>', { //build a li element

        html: jQuery('<a/>', { //with a A element inside it

                href: #', //set the href for the link

                text: anchor2.attr('value'), //and the text

                class: anchor2.attr('class'),

            })

      }).appendTo($('#jquery_snippets')); //append it to a list

    });

    $('#jquery_snippets p').remove(); //remove this first li ("Loading...") when done

  });

});

index.html

Kod:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"

  "http://www.w3.org/TR/html4/strict.dtd">

<html dir="ltr" lang="en-US">

  <head>

    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

    <title>Cross-Domain Ajax Demo</title>

    <link rel="stylesheet" type="text/css" media="screen" href="css/reset.css">

    <link rel="stylesheet" type="text/css" media="screen" href="css/main.css">

    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>

    <script type="text/javascript" src="js/jquery.xdomainajax.js"></script>

    <script type="text/javascript" src="js/main.js"></script>

  </head>

  <body>

    <div id="wrapper">

      <p>

        Fragmenty:

        <div id="jquery_snippets" style="font-size: 20px;">

          <p style="font-size: 12px;">Loading...</p>

        </div>

      </p>

    </div>

  </body>

</html>

Zaloguj się
Login:
Hasło:	Nie pamiętam hasła
	Zapamiętaj mnie