在jQuery中加载在Chrome和Safari中都不起作用

时间:2016-02-24 03:28:36

标签: jquery ajax google-chrome safari ahah

[更新]它仅适用于Firefox,不适用于Chrome或Safari。 我正在关注jQuery tutorial (AHAH)但是当我点击鲜花时,“更多显示”部分中没有显示说明。

enter image description here     $(document).ready(function(e){

var $flowers = $('#flower-items');

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

    var $desc = $('#flower-description');

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

这是文件夹结构: enter image description here

enter image description here

1 个答案:

答案 0 :(得分:1)

这对我来说很有用:

<script type="text/javascript" src="https://code.jquery.com/jquery-2.2.0.min.js"></script>

<ul id="flower-items">
    <li><a href="calla.html">Flower 1</a></li>
    <li><a href="sunflowers.html">Flower 2</a></li>
    <li><a href="iris.html">Flower 3</a></li>
    <li><a href="alstromeria.html">Flower 4</a></li>
    <li><a href="5.html">Flower 5</a></li>
    <li><a href="6.html">Flower 6</a></li>
    <li><a href="7.html">Flower 7</a></li>
</ul>

<div id="flower-description">Flower Description</div>



<script type="text/javascript">
$(document).ready(function(){

    var $flowers = $('#flower-items');

    $('#flower-items').find('a').on('click', function(e){
        alert('a');
        e.preventDefault();

        var $desc = $('#flower-description');

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

})
</script>

你应该在控制台中看到这个:

enter image description here