Ajax加载功能在html中不起作用

Question

问题已修复。非常感谢大家。

我试图通过将该文件放在它开始工作的 Web 服务器（xampp 服务器）上直接脱机而不是 Web 服务器运行该文件。

我正在尝试使用 ajax 在另一个 html 文件中加载一些 html 数据以加载 html 文档，但它不起作用。好吧，那是我的愚蠢：-P

<div id="css_change"></div><br />


<div id="menu_"><a href="calla.html">Opt 1</a> <a href="sunflowers.html">Opt 2</a> <a href="iris.html">Opt 3</a> <a href="alstromeria.html">Opt 4 </a></div>
<br />
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script>


$(document).ready(function(e) {

var $flowers = $('#menu_');

$('#menu_').find('a').on('click', function(e){
    e.preventDefault();

    var $desc = $('#css_change');

    switch($(this).attr('href')) {
        case 'calla.html' :
            $desc.load('text/lilies.html');
            break;
        case 'sunflowers.html' :
            $desc.load('text/sunflower.html');
            break;
        case 'iris.html' :
            $desc.load('text/irises.html');
            break;
        case 'alstromeria.html' :
            $desc.load('text/peruvian.html');
            break;
    }
});


});
</script>
</body>
</html>

而且我认为preventDefault(); 功能不起作用。

我正在尝试使用 ajax 将 html 位从一个文档加载到另一个文档。 请帮忙。

Answer 1

使用 http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js 为 $ 定义。

没有 http 可能会导致问题。 e.preventDefault() 防止默认值

Answer 2

我得到了解决方案。我正在离线预览这些文件。现在在尝试了所有事情之后。我只是将所有文件移动到 Web 服务器并尝试了它们。 waala 它开始工作了。感谢大家的努力。

哦，是的，很少有变化对我有帮助。感谢@SuperOV 为

http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js for $ define.

成功了。

Answer 3

我已直接使用 '#menu_ a' 而不是 find a 来修复代码，并且 return false 而不是 e.preventDefault。

检查一下

$(document).ready(function() {

    var $flowers = $('#menu_');

    $('#menu_ a').on('click', function(){

        var $desc = $('#css_change');

        switch($(this).attr('href')) {
            case 'calla.html' :
                $desc.load('text/lilies.html');
            break;
            case 'sunflowers.html' :
                $desc.load('text/sunflower.html');
            break;
            case 'iris.html' :
                $desc.load('text/irises.html');
            break;
            case 'alstromeria.html' :
                $desc.load('text/peruvian.html');
            break;
        }

    return false;

    });

});