Question

我有一个自定义弹出窗口，只需点击一下按钮即可显示。

当我点击它外面时，pop = up应该关闭（焦点输出），当我点击弹出窗口内部时不应该关闭。它工作得很漂亮，但是当我在pop = up中将项目从一个列表移动到另一个列表时，我遇到了问题。在这种情况下，焦点丢失，pop = up。我希望它保持开放。

我的实际实施

> http://jsfiddle.net/7fsxr2ed/6/

任何帮助将不胜感激

Answer 1

在$（popupSelector）.focusout（）函数中只需注释

行

 $(popupViewSelector).hide();

我更新了小提琴，链接是http://jsfiddle.net/7fsxr2ed/8/

希望这会对你有所帮助。

Answer 2

我提出这个解决方案。尝试

function createPopup(triggerSelector, popupViewSelector, popupSelector, showCallback, hideCallback ) {    
    var $trigger = $(triggerSelector);
    var $popupView = $(popupViewSelector);

    $trigger.on('click', function(e){
        e.preventDefault();
        if($popupView.is(':visible')) {
            $popupView.hide();
            if(hideCallback) {
                hideCallback();
            }
        } else {
            $popupView.show();
            if(showCallback) {
                showCallback();
            }
        }
    });

    $(document).on('click.popup', function(e) {
        var $target = $(e.target);

        if(!$target.closest($popupView).length && !$target.closest($trigger).length) {
            $popupView.hide();
            if(hideCallback) {
                hideCallback();
            }
        }
    });
}

http://jsfiddle.net/7fsxr2ed/9/

自定义弹出焦点事件

2 个答案: