Question

我有一个问题是一个列表，当点击链接时，现在有一个锚链接我不希望浏览器转到该网页，而是希望浏览器保持在当前页面并在警报中显示列表框给用户。我知道这可以通过javascript完成，也可以使用列表项上的onclick事件并显示一个警告框但是如何阻止浏览器进入该网页。

 <ul id='list_o_links'>
    <li><a href='http://www.google.com'>List Item1</a></li>
    <li><a href='http://www.yahoo.com'>List Item2</a></li>
    </ul>

Answer 1

$("#list_o_links").children().click(function () {
    var list = [];

    $.map($("#list_o_links").children(), function (elem) {
        list.push($(elem).text()); // take the text of each list item
    });

    alert(list.join(', '));

    return false; // stop the browser from going to the link
});

jsfiddle example

Answer 2

通过调用event.preventDefault()或在绑定事件处理程序中返回false，可以阻止浏览器转到链接目标。我认为第一个更明确：

var alert_instead_of_following_link = function (event) {
    event.preventDefault();
    alert(this.href);
};

$("#list_o_links a").bind("click", alert_instead_of_following_link);

javascript点击事件问题

2 个答案: