滑动左右类可防止显示下拉列表

Question

我的患者名单中的div一个低于另一个。这些div包含每个div条内的Swipe和Dropdown。

滑动： 如果这个div被向右/向左滑动，则会调用某个URL。

<div class="patient-list__info swipe swipe-left-right" linkRight="www.example.com" linkLeft="www.example.com">

下拉列表

<div class="btn-group dropleft">
<button type="button" class="btn btn-sm btn-primary dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">2000</button>
<div class="dropdown-menu">
    <a class="dropdown-item font-blue" href="www.example.com">Print</a>
    <a class="dropdown-item font-blue" href="www.example.com">Upload</a>
</div>

  

问题：

Dropdown隐藏在其他患者条带（div）后面。

  

尝试：

1. 如果我们从div中删除向左滑动，则下拉列表显示效果很好，但滑动功能无法正常工作。

2. 尝试过Z-index但没有成功。

  

html代码

<div class="patient-list__info swipe swipe-left-right" linkRight="www.example.com" linkLeft="www.example.com">
<div class="btn-group dropleft">
    <button type="button" class="btn btn-sm btn-primary dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">2000</button>
    <div class="dropdown-menu">
        <a class="dropdown-item font-blue" href="www.example.com">Print</a>
        <a class="dropdown-item font-blue" href="www.example.com">Upload</a>
    </div>
</div>

  

滑动Jquery代码

var s2 = Swiped.init({
    query: 'li>.swipe-left-right',
    list: false,
    left: 5,
    right: 5
});
jQuery(document).on('touchstart', 'li>.swipe-left-right', function() {
    $(".patient-list").css("overflow", "hidden");
    $(".patient-list__info--mirror").css("display", "block");
    s2.open;
});

var onOpenfunction = function() {
    var clickUndo = false;
    var dir = this.dir;
    var offset, invert_offser;
    if (dir === 1) {
        offset = '110%';
        invert_offser = '-110%';
    } else {
        offset = '-110%';
        invert_offser = '110%';
    }
    jQuery(this.elem).animate({left: offset});

    console.log(offset);
    jQuery('.patient-list__info--mirror',jQuery(this.elem).parent()).css('left',invert_offser).animate({left: 0});

    jQuery('.patient-list__info--mirror',jQuery(this.elem).parent()).click(function () {

        jQuery('.patient-list__info',jQuery(this).parent()).not('.patient-list__info--mirror').animate({left: 0});
        jQuery(this).animate({left: invert_offser});
        clickUndo = true;
        $(".patient-list__info--mirror").css("display", "none");
        jQuery(this).off();
    });
    var currentElem = this.elem;
    var parentElem = jQuery(this.elem).parent();
    setTimeout(function() {
        if(!clickUndo) {
            jQuery(parentElem).hide();
            if(dir === 1){
                window.location.replace(jQuery(currentElem).attr('linkRight'));
            } else {
                window.location.replace(jQuery(currentElem).attr('linkLeft'));
            }
        }
    }, 2000);
};

Swiped.init({
    query: 'ul.swipe-list>li>.swipe-left-right',
    onOpen: onOpenfunction
});