Question

我正在尝试对某些超链接使用preventDefault操作以防止它们被激活，而是调用一些ajax。但它似乎不起作用。

我使用的代码如下：我有以下代码：

    $("#" + container_id + " a[id^=read_more_link]").click(function(event){
        alert($(this).html());
        event.preventDefault();
});

现在有趣的是警报框会触发，因此它肯定会注册click事件，但它似乎无法识别preventDefault（）调用。

我尝试了一项简单的测试，简化了我的代码，但仍然无效：

<a id="read_more_link" data-article_id="1" href="news/1">Read More</a>

    $("#read_more_link").on("click", function(event){
        alert("test");
        event.preventDefault();
    });

警告框会触发，但页面会跟随链接。

注意：如果我使用'Return False'但不使用preventDefault

Answer 1

你在这里！

function(e){
    e = e || window.event;
    e.preventDefault();    
}

小提琴：http://jsfiddle.net/rXCcB/2/

编辑：正如11684正确指出的那样，详细说明会有所帮助。

有些浏览器会将e识别为window.event，其中包含有关某个事件的所有信息;在这种情况下，您尝试操作的单击事件。其他一些浏览器没有，所以在函数的第一步发生的事情是在e的定义上对所有浏览器进行规范化。最终结果是，e的每个引用都指向window.event，此时您可以安全地使用e.preventDefault()，因为您知道所有浏览器都准确理解您的意思。

Answer 2

您似乎阻止了具有某个父级的链接的默认操作，那么您的选择器应该是这样的：

我的HTML是：

<p id='aaa'>
   <a id='read_more_link' href='#'>adf</a>
</p>

jquery：

var container_id = $('#aaa');
$("a[id^='read_more_link']", container_id).click(function(event) {
   alert($(this).html());
   event.preventDefault();
});

查看小提琴：http://jsfiddle.net/EEZEe/

看看这是否有助于你。

Answer 3

至少有一种更简单，更好的方法：

更容易：

$("#" + container_id + " a[id^=read_more_link]").click(function(){
    alert($(this).html());
    return false;
});

无需使用event参数，也无需调用函数。

更好：

使用按钮代替链接：

<p id='aaa'>
   <button id='read_more_link' type='button'>adf</button>
</p>

然后你不会遇到这个问题，因为按钮就是为了这个 - 事件。我们建立了链接链接，return false或preventDefault()虽然有效但也可以解决方法。

PreventDefault不起作用

3 个答案: