JQuery无法在移动的(iPhone)上打开Bootstrap模式

lpwwtiir  于 2023-08-04  发布在  jQuery
关注(0)|答案(3)|浏览(135)

我有一个JavaScript/JQuery函数,它应该在 AJAX 请求后打开一个引导模式。
这在使用Chrome的PC上有效,但不幸的是它在iPhone上不起作用(Chrome/Safari)

按钮:

<button type="button" id="GetEmployees" class="btn btn-primary" onclick="GetEmployees()">
    <span class="glyphicon glyphicon-user">&nbsp;</span>Toevoegen
</button>

字符串

功能:

function GetEmployees() {
    $.ajax({
        type: 'post',
        url: appPath + '/TimeRegistration/GetEmployees',
        data: {  },
        success: function (response) {
            if (response != null) {
                alert("Load");
                $("#dialog-project .modal-body").html(response);
                $("#dialog-project").modal("show");
                alert("open");
            }
        },
        error: function (response) {
            alert("Onbekende fout opgetreden")
        }
    });
}

下面是对话框本身:

<div id="dialog-project" class="modal fade" tabindex="-1" role="dialog" style="color: #333333;">
    <div class="modal-dialog modal-sm">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                <h4 id="dialog-title" class="modal-title">Aanmaken nieuwe tijdregel</h4>
            </div>
            <div class="modal-body">
            </div>
        </div>
    </div>
</div>


由于某种原因,我在iPhone上得到了警报“加载”,但模态没有显示,最后一个警报也没有显示。

edit 2:为了让按钮在第一个地方执行JS,我必须添加:

$(document).ready(function () {
    var touchEvent = 'onclick' in window ? 'click' : 'touchstart';
    $('#GetEmployees').on('click touchstart', function () {
        GetEmployees();
    })
})

1yjd4xko

1yjd4xko1#

我也面临着同样的问题。我是通过以下代码修复的。

$( "#code" ).on('shown', function(){
    $('body').css('position','fixed');
});

字符串
在IOS浏览器的位置有问题,它采取固定的位置。

bvpmtnay

bvpmtnay2#

这是由于iOS设备上的CSS问题。
使用cursor:指针;在CSS中。你可以在其中添加类。如:-

.iosmodal{
    cursor: pointer;
}

字符串

kpbwa7wx

kpbwa7wx3#

function GetEmployees() {
$.ajax({
    type: 'post',
    url: appPath + '/TimeRegistration/GetEmployees',
    data: {},
    success: function (response) {
        if (response != null) {
            console.log("Load");
            $("#dialog-project .modal-body").html(response);
            $("#dialog-project").modal("show");
            console.log("open");
        }
    },
    error: function (xhr, status, error) {
        console.log("Error status: " + status);
        console.log("Error message: " + error);
        alert("An unknown error occurred. Please try again.");
    }
});

字符串
}
下面是该函数的更新版本,使用console.log进行了一些额外的错误处理:
通过使用console.log语句,您可以检查浏览器的控制台以查看任何错误消息或日志。这可以提供有关iPhone设备上可能出现的问题的更具体的信息。
请记住在多个设备和浏览器上测试应用程序,以确保跨平台兼容性。如果您遇到特定的错误消息或行为,您可以提供更多详细信息以获得进一步帮助。

相关问题