Question

我遇到了问题。以下是我的代码：

$(function() {  
    $('#find').on("click",function(){
        name = $('#q_name').text();
        location = $('#q_location').text();
        city = $('#q_city').text();
        alert("Clicked");
    });
});

如果点击id为find的此锚标记，则会显示警告“点击”，然后重新加载整个页面。我分别从p标记获取名称，位置和城市值。

此外，当我只保留一个作业并丢弃其他两个作业时，页面重新加载停止并且仅发生警报。这是开始，因为我必须通过AJAX将这些收集的数据发送到控制器功能，但首先我想停止重新加载页面。我做错了什么？

P.S：我对jQuery很新，只知道它的基础知识。请帮忙。

Answer 1

您需要使用event.preventDefault停止链接的默认行为（即更改网址），试试这个：

$('#find').on("click", function(e){
    e.preventDefault();
    name = $('#q_name').text();
    location = $('#q_location').text();
    city = $('#q_city').text();
    alert("Clicked");
});

Answer 2

将location变量重命名为location1。我认为它指的是浏览器位置。

Answer 3

试试这个。简单易行

修改href属性，如下所示

<a href="javascript:void(0)" onclick="whateverFunction()" >

Answer 4

要停止锚标记的页面重新加载和导航行为，您可以使用javascript:void(0)或event.preventDefault()

<a href="javascript:void(0)" id="find">Click</a>

或

$(function() {  
    $('#find').on("click",function(e){
        e.preventDefault()
        name = $('#q_name').text();
        location = $('#q_location').text();
        city = $('#q_city').text();
        alert("Clicked");
    });
});

现在，点击此锚标记后，您的页面将不会重新加载。

jquery函数在click事件上重新加载页面

4 个答案: