使所有modals都可拖放，只有具有特定父类的模式除外。

Question

我试着让我网站上的所有调制解调器都是可拖动的，但是某些带有.fullscreen类的模块我不想拖放。

我似乎不能忽略带有.fullscreen类的modals，因为它是.modal-dialog的父类。

我尝试过多种选择器，但似乎不起作用。

const $modal = $('.modal');
$(".modal-dialog:not(.modal.fullscreen)", $modal).draggable({
     handle: '.modal-header'
}); 

<div id="employee-modal" class="modal fullscreen dark advanced-search show">
        <div class="modal-dialog">
            <div class="modal-content">
                ....
            </div>
        </div>
    </div>

Answer 1

如果你这样做了呢

const $modal = $('.modal:not(.fullscreen)');
$(".modal-dialog", $modal).draggable({
     handle: '.modal-header'
}); 

假设这是您编写的代码的一个很好的表示形式，这应该只是将您的对话框选择器的上下文更改为不包括全屏幕模式。如果您接下来要在其他地方使用$modal，则可以这样做：

const $modal = $('.modal');
$(".modal-dialog", $modal.filter(':not(.fullscreen)')).draggable({
     handle: '.modal-header'
}); 

同样的想法，将上下文更改为不包括全屏上下文。不过，读起来并不容易，所以我可能会把它拉到const nonFullScreenModals = $modal.filter(':not(.fullscreen)');上。