javascript - Jquery ajax 调用在移动设备上不起作用

Question

当用户选中复选框时，我尝试使用 ajax 和 jquery 提交表单。然后它应该向 order.php 页面提交 ajax 调用。

这是使用的javascript

$(document).ready(function () {
    $("#statusform").on("change", "input:checkbox", function () {
        $("#statusform").submit();
    });
});

$(function () {
    $('#statusform').on('submit', function (e) {
        e.preventDefault();
        $.ajax({
            type: 'POST',
            url: 'order.php?id=<?php echo $id; ?>&action=changestatus',
            datatype: "json",
            data: $(this).serialize(),
            success: function (data) {
                console.log(data["json"]);
            },
            error: function (jqXHR, textStatus, errorThrown) {
                console.log(JSON.stringify(jqXHR));
                console.log("AJAX error: " + textStatus + ' : ' + errorThrown);
            }
        });
    });
});

这是表格

<form id="statusform">
    <input type="checkbox" data-role="flipswitch" name="betalt" id="betalt" data-on-text="Betalt" data-off-text="Ikke betalt" data-wrapper-class="custom-size-flipswitch" <?php if ($row['betalt']) {echo "checked";}?>>
    &nbsp;&nbsp;
    <input type="checkbox" data-role="flipswitch" name="leveret" id="leveret" data-on-text="Leveret" data-off-text="Ikke leveret" data-wrapper-class="custom-size-flipswitch" <?php if ($row['leveret']) {echo "checked";}?>>
</form>

在桌面电脑浏览器上一切正常，但在我的 iPhone 上的 google chrome 移动浏览器上尝试时，它似乎没有任何作用。

你们有什么想法吗？

Answer 1

看来我找到了答案......至少在某种程度上。

问题出在 IOS 上的 Chrome 中。例如，当您单击指向“Order.php”的 anchor 链接(“a href”)时。它将输入 URL http://website.com/#/order.php - 这会导致 AJAX 调用由于某种原因停止工作。

如果我删除了哈希值，它就会按预期工作。

我相信主题标签是由 jquery mobile 引起的，因为链接位于 jquery mobile 选项卡控件中并且是 jquery mobile ListView 。在 Safari (iOS)、Chrome (PC) 和 IExplorer (PC) 上，一切都按预期运行，并且链接不会添加主题标签。

有人知道为什么 chrome 会这样做吗？也许如何规避这个问题？