javascript - 功能不适用于网络浏览器中的模态

Question

我有问题我的功能在移动浏览器中不起作用但是当我在浏览器桌面工作时打开我不知道为什么......也许有人知道或有像我这样的经验 我试过这段代码

$('body').on('click touchstart', '.show_range', function(event) { alert("hello"); })

在桌面上工作但不能在移动浏览器上工作

当我在我的链接中设置 id 时，我已经尝试过这段代码

$(document).on("click", "#show_range", function(event){
 alert( "GO" ); 
 });

在桌面上工作但不能在移动浏览器上工作

Answer 1

如果你使用的是 bootstrap modal，那么做一些如下的改变，

在 bootstrap-responsive.css 中

.modal { 
    position: fixed; 
    top: 3%; 
    right: 3%; 
    left: 3%; 
    width: auto; 
    margin: 0; 
}
.modal-body { 
    height: 60%; 
}

在 bootstrap.css 中

.modal-body { 
    max-height: 350px; 
    padding: 15px; 
    overflow-y: auto; 
    -webkit-overflow-scrolling: touch; 
 }

或 试试这个，

if( navigator.userAgent.match(/iPhone|iPad|iPod/i) ) {
    var styleEl = document.createElement('style'), styleSheet;
    document.head.appendChild(styleEl);
    styleSheet = styleEl.sheet;
    styleSheet.insertRule(".modal { position:absolute; bottom:auto; }", 0);
 }