Javascript 如何在使用JS单击时为div提供更高的z索引？

我昨天问了这个问题，希望这个问题更清楚，因为我现在提供了一个我的商店的工作示例

我正在开发Shopify主题。我一直用它作为我的基地，目前我的快速购物车和快速购物/查看抽屉有问题

我的站点右侧有两个抽屉，一个用于购物车，一个用于产品快速查看选项。抽屉当前滑开-#PageContainer在单击时向左移动以显示每个抽屉

由于它们当前处于彼此的顶部，我需要更改JS，以便单击z索引时进行更改，以便调用的正确抽屉在堆栈中处于最高位置

我不擅长JS，所以不确定这是否是一项简单的任务

这里有一个链接到我的

JS:

更新

按照Ciprian的指示，我在JS中放置了以下内容，这使得#CartDrawer具有更高的z索引。我现在不确定我是如何调整它的，这样它就知道哪个按钮的点击率更高。这就是我尝试过的：

...

Drawer.prototype.init = function () {
$(this.config.open).on('click', $.proxy(this.open, this));

$('.js-drawer-open-right-two').click(function(){
  $(this).data('clicked', true);
});

if($('.js-drawer-open-right-two').data('clicked')) {
  //clicked element, do-some-stuff
  $('#QuickShopDrawer').css('z-index', '999');
} else {
  //run function 2
  $('#CartDrawer').css('z-index', '999');
}

this.$drawer.find(this.config.close).on('click', $.proxy(this.close, this));
};

...

---

方法如下：

$('.yourselector').css('z-index', '999');

在

onclick（）

函数中添加它（并根据您的需要进行调整）。

您可以使用：

document.getElementById("your-element-id").style.zIndex = 5; 

---

它是纯Javascript，并将z索引设置为5。只需将此绑定到onClick事件

如果在单击按钮时需要修改div的z索引，则应在onclick（）函数中输入此代码，否则，如果在打开页面时需要激活此代码，则应将其放在$（document）.ready（）函数中，代码为：

$('#yourID').css('z-index', '10');

---

谢谢你的回答，我想我理解你的意思，但是由于JS附带了木材，我不确定我需要在我当前的JS中放在哪里。我应该改编这部分吗？…'Drawer.prototype.init=function（）{$（this.config.open）.on（'click'，$.proxy…'我想在这一行下：

this.nodes.page.on（'click.Drawer'，$.proxy（function）（）{

@Ciprian，您在999之后漏掉了一个撇号。'.yourselector'是触发抽屉打开的按钮吗？还是包含我要显示的内容的div？也是

this.$nodes.page.on（'click.drawer'，$.proxy（函数（）{

与关闭抽屉无关？您应该将

选择器更改为触发抽屉打开/关闭的按钮。另外，尝试将该行添加到每个
onclick（）中
函数。我不知道您的代码是如何工作的。您好，谢谢您的回答，我知道这需要应用于单击事件，但由于我对JS不太在行，我只是不确定应该重写当前代码的哪一部分或如何重写。@user2498890，您希望将单击绑定到的元素的选择器是什么？它的选择器是什么要更改z索引的元素？他使用的是jQuery，因此此解决方案不合适。@Ciprian，如果使用jQuery，并不意味着不能使用速度更快的纯Javascript:）因此，我有两个抽屉，一个是“QuickShopDrawer”，另一个是“CartDrawer”-单击“购物车”和“添加到购物车”打开购物车抽屉，单击“购买”打开快捷商店。
$('#yourID').css('z-index', '10');