动态更新表单操作间歇性失败

时间:2017-03-28 05:27:31

标签: javascript jquery

点击链接后,我会触发模态并根据点击的链接动态设置模态中包含的表单操作。

几乎每次都有效;但是,测试人员报告的可能是50次中的1次,但操作未更新。在IE11和最新的Chrome中已经重现了间歇性故障。

以下是代码的要点

<ul>
  <li><a class="action_url" href="http://somedomain.com">Some Domain</a></li>
  <li><a class="action_url" href="http://anotherdomain.com">Another Domain</a></li>
  <li><a class="action_url" href="http://yetanotherdomain.com">Yet Another Domain</a></li>
</ul>

<div id="myModal" class="modal fade" role="dialog">
  <div class="modal-dialog">

    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal">&times;</button>
        <h4 class="modal-title">Post Your Message</h4>
      </div>
      <div class="modal-body">
        <form role="form" class="message-form" method="post" action="">
          <div class="form-group">
            <input type="text" class="form-control" id="message" placeholder="message" name="message" value="">
          </div>
          <button type="submit" class="btn btn-success btn-block">Post</button>
        </form>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
      </div>
    </div>
  </div>
</div>

<script>
$(document).on("click", ".action_url", function(e) {
  e.preventDefault();
  $(".message-form").attr('action', e.target.href);
  $("#myModal").modal();
});
</script>

和链接 jsfiddle

我已经创建了一个使用setTimeout的替代版本(但这有点像黑客,更重要的是没有完全消除这个问题)

有人在野外看过这个问题吗?知道原因吗?最重要的是修复?

0 个答案:

没有答案