Question

我有这个HTML：

<div class="box" id="n5">
    <p class="text">Lorem ipsum dolor sit amet</p>
    <textarea id="contentArea" rows="10" cols="50"></textarea>
    <div class="more">LikeAlink</div>
</div>

和这个jQuery函数：

$(document).ready(function(){
    $(".box .more").click(function(event){
        $.ajax({
            url : "test.txt",
            success : function (data) {
                $("#contentArea").html(data);
            }
        });
    });
});

我在互联网上找到了这个解决方案。为什么它对我不起作用？我使用的是Chrome，但该示例适用于此浏览器。

内容未显示在文本框中。 Example

编辑：

我在控制台中有以下错误消息：

XMLHttpRequest无法加载file：/// C：/wamp/www/test.txt。 Access-Control-Allow-Origin
不允许使用原点null

编辑＃2：

对于那些感兴趣的人来说，这似乎是Chrome在本地服务器上的一个问题。要进行测试，请使用此参数启动Chrome

- 禁用-web的安全

chrome.exe --disable-web-security

Answer 1

根据你的评论

XMLHttpRequest无法加载file：/// C：/wamp/www/text.txt。 Access-Control-Allow-Origin
不允许使用原点null

这是因为您从文件系统加载它而不是通过Web服务器提供它。

我使用一些JSON数据做了同样的事情并且得到了相同的结果。在您的网络服务器中设置正确的MIME类型，并从http://example.com/text.txt而不是file:///C:/wamp/www/text.txt

提供

如果您认为已正确配置了所有内容，请尝试记录data作为第一步返回的内容。

$(document).ready(function(){
    $(".box .more").click(function(event){
        $.ajax({
            url : "test.txt",
            success : function (data) {
                // either
                alert(data);
                // or
                console.log(data);
            }
        });
    });
});

在jQuery网站上阅读更多关于jquery.ajax的信息。

http://api.jquery.com/jQuery.ajax/
http://api.jquery.com/jQuery.ajaxSetup/

为什么我的jQuery加载功能不起作用？ - 在Chrome上

1 个答案: