如何获取使用JavaScript生成的Z-index的链接
我正在重新调整代码的用途，并且由于jQuery生成的z索引，我遇到了下拉框内的链接不起作用的问题。原始画笔中的代码也不起作用。
我理解z索引，但在本例中，jQuery代码将z索引10应用于呈现其后面的链接的包含元素。每次使长方体可见时，jQuery也会迭代z索引(请参阅代码部分)。
HTML和CSS在Codepens中：
1)原始码：https://codepen.io/candroo/pen/wKEwRL
2)我的助手：https://codepen.io/Rburrage/pen/PooGKoM?editors=1100
在这件事上我需要帮助，please...and，谢谢。我觉得我忽略了一些非常简单的东西。
下面是我尝试过的：
1)删除jQuery z索引，并使用CSS添加它。
2)删除所有jQuery z索引引用，看看是否可以让链接正常工作
3)将链接上的z索引(.card-description a)更改为比所有其他z索引更大的数字
4)阅读StackOverflow上的所有z索引问题，看看我是否能解决它
$jq(document).ready(function () {
$jq(document).ready(function () {
var zindex = 10;
$jq("div.card").click(function (e) {
e.preventDefault();
var isShowing = false;
if ($jq(this).hasClass("show")) {
isShowing = true
}
if ($jq("div.cards").hasClass("showing")) {
// a card is already in view
$jq("div.card.show")
.removeClass("show");
if (isShowing) {
// this card was showing - reset the grid
$jq("div.cards")
.removeClass("showing");
} else {
// this card isn't showing - get in with it
$jq(this)
.css({ zIndex: zindex })
.addClass("show");
}
zindex++;
} else {
// no cards in view
$jq("div.cards")
.addClass("showing");
$jq(this)
.css({ zIndex: zindex })
.addClass("show");
zindex++;
}
});
});
});我在控制台中看不到任何错误消息。为了简单起见，我将所有链接都改为指向Google。该链接似乎可以单击，但当我单击它时--该框会折叠，但我不会被带到所需的URL。
回答 2
Stack Overflow用户
发布于 2019-10-18 04:32:53
试试这个：
$("div.card").click(function (e) {
//e.preventDefault();这一行是活动的，如果您像我的示例中那样删除它或注释它，它应该会使urls工作。
不确定为什么它没有被评论甚至在那里...也许它的原意是让urls不工作，也可能是我漏掉的其他东西。
Stack Overflow用户
发布于 2019-10-18 05:00:37
我投票支持奥斯瓦尔多，因为他的帖子促使我研究prevenDefault()，直到我发现了stopPropagation()。他的评论帮助我解决了这个问题。
我需要另一个函数来定位框内的链接(.card-description)并对其调用stopPropagation。
$jq(".card-description a").click(function (e) {
e.stopPropagation();
});这就解决了问题。谢谢大家！
https://stackoverflow.com/questions/58440013
复制相似问题
腾讯云开发者
