Question

我们正在使用Twitter Bootstrap弹出一些模态窗口并使用一些ajax调用。我们遇到的一个问题是iPad设备。

我们有这个按钮：

<button class="btn btn-primary" id="reviewbutton" type="button">Submit Purchase Code</button>

将click事件绑定到此函数：

<script type="text/javascript">
  $(document).ready(function() {
    $("#reviewbutton").click(function(event) {
      event.preventDefault();
      $.ajax({
        url: "http://www.ourdomain.com/script.asp?purchase_code="+$("#purchase_code").val(),
        cache: false,
        success: function(data) {
          $("#review_form").modal("hide");
          if (data.indexOf('BADCODE') != -1) {
            $("#review_badcode").modal("show");
          } else if (data.indexOf('EMPTYCODE') != -1) {
            $("#review_badcode").modal("hide");
          } else if (data.indexOf('CODEOK') != -1) {
            alert("all ok");
          }
        }
      });
    });
  });
</script>

输入购买代码后，我们会执行ajax查找以查看代码是否为空，格式错误或其他有效。我们的script.asp对数据库执行查找并返回相应的代码，例如如果购买代码不存在，则为BADCODE。

在iPad设备上，点击事件直到单击按钮两次才会触发。在桌面浏览器上，代码完美运行。有解决方法，还是已知错误？我们尝试过BootStrap 2.3.1和2.3.2。

Answer 1

此按钮是否有工具提示？在移动设备上，您必须单击一个元素才能显示它的工具提示。因此，如果有工具提示，则第一次单击将显示该提示。必须在工具提示打开的情况下再次单击该按钮才能触发点击事件。

Bootstrap和<button>标签 - 事件未首次触发 - 仅限iPad </button>

1 个答案: