只有从选择菜单中选择选项后,Bootstrap 3模式才会在iPad Safari上消失

Question

我在Web应用程序中有一个注册功能,它使用户通过一个四步过程向站点添加信息.当用户单击"添加"按钮时,将出现一个Bootstrap模式,用户在步骤#1启动.

每个步骤都有一个选项菜单供用户选择,每个步骤中填充的数据取决于前面步骤的选择.用户可以将步骤留空并继续,但是他们没有选择来完成剩余的过程.除了iPad上的Safari之外,此功能在每个桌面和移动浏览器中都表现得如预期.

在Safari中,用户将打开模式,在步骤1中选择数据,然后转到步骤2.如果用户未在此下拉列表中选择任何内容,则可以继续执行步骤3.但是,如果他们在步骤2中做出选择,模态消失,用户无法继续.这只发生在Safari for iPad/iPhone上.

我已尝试在iPad上设置Web检查器并在Mac上加载控制台,但控制台中没有错误或其他消息.我试图弄清楚这是否是Safari中的错误,或者Safari是否与其他浏览器不同地处理来自select标签的模态输入.

Answer 1

请开发者朋友看一下。他添加了这个功能：

jQuery.usingSafari = function(allowDevices){
allowDevices = allowDevices != undefined ?  allowDevices : true;
if(!allowDevices){
    return /iPhone|iPad|iPod|Safari/i.test(navigator.userAgent)  
        && navigator.userAgent.indexOf('Chrome') == -1 
        && navigator.userAgent.indexOf('iPhone') == -1
        && navigator.userAgent.indexOf('iPad') == -1 
        && navigator.userAgent.indexOf('iPod') == -1;
} else{
    var results =  /iPhone|iPad|iPod|Safari/i.test(navigator.userAgent) &&    navigator.userAgent.indexOf('Chrome') == -1;
    return results;
}

}

//Disable backdrop
if(jQuery.usingSafari(false)) {
document.write('<style>div.modal-backdrop{ display:none; }</style>');

}

然后是模态调用：

    jQuery('#player-lightbox').modal({
            backdrop: jQuery.usingSafari(true) ? "static" : true,
            show:true}
        );

这似乎已经解决了问题。希望这对其他人有帮助！