Question

这是遗留代码。我正在开发一个项目，我们正在使用iframe来模拟AJAX。

基本上，我们使用target属性在iframe中提交<form>，导致请求无法打开新标签。此外，我们在PHP的响应中回显<script></script>，并且结果在填充iframe时执行。

以下是此类<form>的示例：

<form id="form_to_submit" method="POST" action="ajax/createUser" target="iframe_name">
    <input type="text" name="input_to_send">
    <button type="button" onclick="$('#form_to_submit').submit()">Submit With Onclick!</button>
</form>

如今，不仅这看起来很邪恶，而且还有一个（也许是其他的）巨大的陷阱。如果通过此过程发出一个请求，并且客户端到达某个地方，然后返回其浏览器历史记录，它将再次发送请求。

要解决最后一个问题，有很多解决方案。我认为我最喜欢的是使用真正的AJAX而不是iframe。现在，从理论上讲，我可以改变源代码中的每一个表单，使其使用AJAX，但我知道我不会为了这个目的而连续工作一周。

我正在寻找一种“快速”方式来拦截这些请求，然后再将它们发送到iframe，然后用AJAX发送它们。

到目前为止，我尝试定位<form>的{{1}}标记并监听target="iframe_name"事件，然后再次使用相同的方法/网址/数据发送请求。< / p>

submit

但这只有在通过真实点击提交按钮提交时才有效。我说95％的案例是通过$('form[target=iframe_name]').on('submit', function (event) { event.preventDefault(event); var url = $(this).attr('action'), datas = $(this).serialize(); $.post(url, datas).done(function (response) { eval($(response).text()); }); });代码提交的onclick表单，在这些情况下，.submit()事件不会触发它。

我被卡住了，不知道吗？

注意：我正在标记jquery只是为了让你知道它可以使用，即使这个问题仍然与JS的任何lib /框架相关。

Answer 1

您只需在文档就绪时执行常规jQuery操作即可删除onclick属性：

<script>
$(document).ready(function() {
    var getButton   =   $('form').find('button');
    getButton.prop('onclick',null);

    // put listener script here for new form submit (using ajax)...
});
</script>

这段代码只是在页面上对所有表单进行常规查找，找到按钮，然后删除onclick属性。执行此操作后，表单不应再使用内联javascript提交。

我建议这是暂时的，因为随着时间的推移逐步将表单更改为使用jQuery监听器本机工作（就像你创建的其他5％的表单没有onclick）

从iframe“AJAX”切换到正确的AJAX

1 个答案: