jquery - 甜蜜的警报输入不专注于 jquery ui 模式

标签 jquery jquery-ui input modal-dialog sweetalert

请看我的jsfiddle https://jsfiddle.net/fp2vg48z/2/

这是代码:

$('a').click(function(){
    $( "#container" ).dialog({
        height: 430,
        width: 620,
        title: 'click hello',
        modal: true,
        buttons: [
            {
                text: 'Back',
                click: function() {
                    $( this ).dialog( "close" );
                }
            }
        ],
        create: function( event, ui ) {

        },
        close: function( event, ui ) {

        }
    });
});

$('.justalert').click(function(){
        swal({
            title: 'hello',
            text:'Please enter name',
            type:'input',
            showCancelButton: true,
            closeOnConfirm: false,
            inputPlaceholder: "E.g john" 
        }, function(inputValue){   
            if (inputValue === false) 
                return false;      
            if (inputValue === "") {     
                swal.showInputError("You need to enter something!");     
                return false;  
            }                               
        swal({title: " success " + inputValue+" added!", type:"success", timer:10000 });
    });
});

$(document).on('click','.hello',function(){
    swal({
        title: 'hello',
        text:'Please enter name',
        type:'input',
        showCancelButton: true,
        closeOnConfirm: false,
        inputPlaceholder: "E.g john" 
    }, function(inputValue){   
        if (inputValue === false) 
            return false;      
        if (inputValue === "") {     
            swal.showInputError("You need to enter something!");     
            return false;  
        }                               
        swal({title: " success " + inputValue+" added!", type:"success", timer:10000 });

    });
});

CSS:

#container{ padding:20px; background:#ccc;display:none;}
.sweet-overlay{z-index:5000;}
.sweet-alert{z-index:5001;}

当在模式顶部触发甜蜜警报时,输入不会获得焦点。我仍然可以选择顶部的文本,但焦点没有发生。我不确定这是否是来自甜蜜警报的东西。

否则输入工作正常。

有什么想法吗?

最佳答案

您可以尝试用空函数覆盖 bootstrap 的 enforceFocus 函数

$.fn.modal.Constructor.prototype.enforceFocus = function() {};

关于jquery - 甜蜜的警报输入不专注于 jquery ui 模式,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/31215222/

相关文章:

javascript - 如何让一个输入表单有多个输出?

jQuery - 侧边栏滑入,并保持窗口宽度

javascript - 使用 jQuery 单击父项时触发提交按钮的单击

jquery - 如何制作可点击的图像以打开带有消息的新选项卡

jquery - angularjs sortable - 更新排序顺序属性

javascript - jqGrid 中的自定义聚合/分组

c - 如何根据用户输入检查文件是否存在于C中

javascript - 强制链接在同一窗口/选项卡中打开

jquery - 以编程方式触发 jQuery UI 对话框上的事件

c++ - 通过变量调用对象