Question

我想使用load（）方法将.txt文件中的文本加载到HTML文档中，但我无法在代码中找到问题。文本文件与我的html文档一起在桌面上。这是我的代码：

HTML：

        <script>
            $(document).ready(function(){
                $('#nav1').click(function(){
                    $('#target').load('textfile.txt');
                });
            });
        </script>

    </head>

    <body>
        <a href="#" id="nav1"> Load Button </a>
        <div id="target"></div>
    </body>

</html>

我在＆＃34; textfile.txt＆＃34; 中的所有内容如下：

<h1> Heading 1 </h1>
<p> Some paragraph text. </p>

Answer 1

尝试以下代码，您需要阻止de click事件
使用e.preventDfeault()

        <body>
            <script>
                $(document).ready(function(){
                    $('#nav1').click(function(e){
                        e.preventDefault()
                        $('#content').load('textfile.txt');
                    });
                });
            </script>

            <a href="#" id="nav1"> Load Button </a>
            <div id="content"></div>
        </body>

请注意，在执行ajax时需要使用服务器

Answer 2

嘿@Nicola Daaboul试试这个：

 <html>      
    <head>
        <script>
        function loadDoc() {
                  var xhttp = new XMLHttpRequest();
                  xhttp.onreadystatechange = function() {
                    if (xhttp.readyState == 4 && xhttp.status == 200) {
                     document.getElementById("demo").innerHTML = xhttp.responseText;
                    }
                  };
                  xhttp.open("GET", "textfile.txt", true);
                  xhttp.send();
                }
        </script>

    </head>

    <body>

        <a href="#" onclick="loadDoc()"> Load Button </a>
        <div id="demo"></div>
    </body>
</html>

实际上你的点击（）不符合你的条件。所以它可以通过上面的代码来完成它肯定适合你。

Answer 3

我测试了你的代码，它的工作非常好。有一些常见的错误，可能是因为你无法获得你的代码，工作。因此，请确保您已完成以下事项：

jQuery文件包含在函数换行之前。
确保textfile.txt与您的目录位于同一目录中脚本驻留。如果没有，请指定正确的路径。
仔细检查没有其他ID为nav1的元素 target。

使用js文件时，请始终参考开发人员工具的控制台选项卡，您可能自己也可以找到解决方案。

jQuery AJAX load。（）方法对我来说不起作用，我做错了什么？

3 个答案: