Question

我使用jquery遇到了一些问题。我有一系列带有href属性的卡片，它调用php页面并使用get方法发送属性。这是一个例子

    <div class="pers_genres_card">
<div class="card-panel teal_green">
    <span class="white-text"><a class="pers_href_white" target="_self" href="generatorgen.php?genre=Blues">Classica</a></span>
</div>
<div class="card-panel teal_orange">
    <span class="white-text"><a class="pers_href_white" href="generatorgen.php?genre=Blues">Blues</a></span>
</div>

现在我有一个中央div，我想在没有页面刷新的情况下加载我的php脚本的结果。这是我的jquery代码：

$(document).ready(function(){
    $('a.pers_href_white').click(function(){
        var page = $(this).attr('href');
        $('#central').load(page);
        return false;
    }
    });
});

但是当我尝试点击href时，结果显示在另一页面中。简而言之，jquery脚本没有启动，所以经典的href属性加载。我已经编写了另一个jquery脚本，它运行得很好，也比这个脚本更复杂，我无法理解为什么它不起作用。

Answer 1

当您点击该链接时，浏览器将重定向到该链接。您必须主动阻止浏览器这样做。您可以使用DOM方法event.preventDefault()。

将您的JS更改为以下内容，它应该有效：

$(document).ready(function(){
    $('a.pers_href_white').click(function(e){
        e.preventDefault();
        var page = $(this).attr('href');
        $('#central').load(page);
        return false;
    });
});

使用jquery在div中加载内容

1 个答案: