preventDefault() 不适用于图片链接答案

【问题标题】：preventDefault() doesn't work on image linkpreventDefault() 不适用于图片链接
【发布时间】：2011-07-20 17:28:57
【问题描述】：

我正在尝试为我的网站创建一个灯箱，但我遇到了问题。因为我对 jQuery 不是很流利，所以我犯了很多错误。其中之一是我不能让 preventDefault() 对文本和图像链接都有效！检查以下代码

HTML 代码：

Text link: <a class='ultbox_simg' href='images/1.jpg'>Image 1</a>
Image link: <a href='images/1.jpg'><img src="images/1t.jpg" /></a>

jQuery 脚本：

$(document).ready(function ($){

    $(".ultbox_simg").click(function (obj){
        obj.preventDefault();
        var img_link=$(this).attr("href");

    });
});

【问题讨论】：

为什么需要防止图像出现默认值？你需要在锚标签上这样做
也许您应该将class 属性添加到图像链接，因为文本链接是？ <a href='images/1.jpg' class='ultbox_simg'>
@Ibu：标题（轻微）具有误导性，但如果您查看代码，他试图钩住的是a，他只是没有钩住它们。

标签： javascript jquery html image hyperlink

【解决方案1】：

您也可以将该类添加到 img 链接：

Text link: <a class='ultbox_simg' href='images/1.jpg'>Image 1</a>
Image link: <a class='ultbox_simg' href='images/1.jpg'><img src="images/1t.jpg" /></a> 

$(".ultbox_simg").click(function (obj){
    obj.preventDefault();
    var img_link=$(this).attr("href");

});

或者（我认为更好），您可以使用该 href 跟踪链接：

$('a[href="images\\/1\\.jpg"]').click(function (obj){
    obj.preventDefault();
    var img_link=$(this).attr("href");

});

【讨论】：

【解决方案2】：

您还应该防止以下方面的默认操作：

<a href='images/1.jpg'>

所以为其添加类，例如“noClick”并添加到脚本中：

$(".noClick").click(function (obj){
        obj.preventDefault();
});

【讨论】：

【解决方案3】：

您需要将 .ultbox_simg 类添加到您的图片链接中。

<a class='ultbox_simg' href='images/1.jpg'><img src="images/1t.jpg" /></a>

【讨论】：

【解决方案4】：

以下是您需要更改的内容：

Image link: <a href='images/1.jpg'><img src="images/1t.jpg" /></a>

到：

Image link: <a href='images/1.jpg'  class='ultbox_simg'><img src="images/1t.jpg" /></a>

现在它可以工作了

【讨论】：

【解决方案5】：

使用$('.ultbox_simg')，您可以选择具有ultbox_simg 类的元素并将click 处理程序绑定到它们。

但是图片链接没有分配这个类..

所以

<a class="ultbox_simg" href="images/1.jpg"><img src="images/1t.jpg" /></a>

【讨论】：