Question

我是JavaScript的新手，我尝试使用函数load（）来插入另一个html文件。它＆＃39;有点难以解释，这是代码：

<script> 
$(document).ready(function() {  
        $('#main').click(
            function(){             
                $('#news').load('today.html');          
            }   
        ); //end click       
}); //end ready 
</script>

你能帮帮我吗？我没有使用网络服务器。谢谢

Answer 1

为什么它不起作用

浏览器安全限制可能阻止您将AJAX函数与通过file：//协议访问的内容（即来自计算机上的本地文件，不带Web服务器）一起使用。

解决方案

我在电脑上运行一个网络服务器，以便我可以避免所有这些问题 - 当我在Windows PC上工作时，我使用了WAMP。这些天，我在我的计算机上使用Linux（使用Apache，PHP和MySQL），这样我就可以在更靠近服务器的环境中工作。

Answer 2

我不相信您提供的代码有任何缺陷。我相信它与你加载JQuery库有关，就像下面的代码我实现了这些结果：

的index.html

<html>
    <head>
        <script src="jquery.js"></script>
        <script> 
            $(document).ready(function() {  
                $('#main').click(
                    function(){             
                        $('#news').load('news.html');          
                    }   
                ); //end click       
            }); //end ready 
        </script>
    </head>
    <body>
        <p id="main">HELLO</p>
        <p id="news">NEWS</p>
    </body>
</html>

news.html

<html>
    <head></head>
    <body><h1>HELLO STACK OVERFLOW!!!</h1></body>
</html>

点击之前：

enter image description here

点击后：

enter image description here

但是，当我构建此示例时，我首先尝试使用 Google API 版本的JQuery，发现我目前无法连接到API。因此，我认为您的问题的解决方案是访问此网站：http://code.jquery.com/jquery-1.11.1.js并将所有内容复制并粘贴到名为＆＃39; jquery.js＆＃39;的文本文件中。然后将以下内容添加到主HTML文件的head标记中：

<script src="jquery.js"></script>

确保＆＃39; jquery.js＆＃39;与项目的主HTML文件位于同一目录中，否则将无法正常工作。希望这有帮助:)

Answer 3

您可以在load(url,fnResponse)响应中找到成功或失败的错误消息

还要选中此jquery-load-method

$(document).ready(function() {  
        $('#main').click(
            function(){             
                $('#news').load('today.html', function( response, status, xhr ) {
                    if ( status == "error" ) {
                        alert( "Sorry but there was an error: " + xhr.status + " " + xhr.statusText );
                    }
                });          
            }   
        ); //end click       
}); //end ready

jQuery load（）函数不起作用

3 个答案:

为什么它不起作用

解决方案