Question

我正在尝试为我的网站创建一个灯箱，但我遇到了问题。由于我不是非常流利的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");

    });
});

Answer 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 traget链接：

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

});

Answer 2

您还应该阻止默认操作：

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

所以为它添加类，例如'noClick'并添加到脚本：

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

Answer 3

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

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

Answer 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>

现在它会起作用

Answer 5

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

但图片链接没有分配此类..

所以

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

preventDefault（）不适用于图像链接

5 个答案: