Question

我正在调试一个问题，并发现Firefox和Safari如何处理onclick JavaScript的奇怪行为。

这是我的代码：

<form id="createMessageForm" action="onclick.php?refresh=<?php echo ++$_REQUEST['refresh'];?>" method="post" >
<input type="hidden" id="iteration" value="1"/>
</form>
<a href="page2.html" target="_blank" onclick="document.getElementById('createMessageForm').submit();return true;">Hello</a>

在Firefox中加载它，它总是为我打开'page2'。但是在Safari中加载它，它只为我打开'page2'大约十分之一或更少。这取决于浏览器是否可以完成'return true;'表格提交之前的声明。

我认为JavaScript总是单线程的，那么这些代码中的预期行为是什么？

Answer 1

正如你所说，Javascript是单线程的。但是，它也很乐意异步工作。

HTTP请求是javascript中的异步事件，因为它们可能需要一段未知的时间才能完成。 Javascript调用HTTP请求，然后继续执行其他任何操作，直到HTTP请求完成并将控制权返回给Javascript（或者在这种情况下，完成并触发浏览器加载新页面）。

在你的情况下，你基本上是从Javascript发出两个HTTP请求，一个接着一个。第二个被解雇，因为Javascript不等待第一个响应;它只是继续下一个。您看到的不可预测的结果基本上是两个HTTP请求中的任何一个首先完成其响应的结果，直到让浏览器加载新页面。

这也是AJAX的工作原理--AJAX中的'A'代表异步。 Javascript发出HTTP请求，并乐意继续做你想做的任何其他事情。 HTTP请求由浏览器处理，当请求准备好时，触发事件以便Javascript接收。这就是为什么使用AJAX调用你需要给它一个“成功”函数，而不是在下一行代码中说if(success)。

这导致我提出解决问题的建议。将表单提交作为AJAX事件触发。这样，浏览器在响应时将永远不会尝试将其作为新页面加载。如果你愿意，你仍然可以告诉浏览器在之后立即触发单独的页面加载，尽管我建议等待第一次完成调用，否则你将不知道它是否真的成功了。

希望能给你一些帮助。

Answer 2

在提交表单并在onclick.php内部处理服务器之后，将php 重定向转换为page2，没有任何理由做你正在做的事情，至少你写的代码没有显示任何理由这样做。

我引用它：

<form id="createMessageForm" action="onclick.php?refresh=<?php echo ++$_REQUEST['refresh'];?>" method="post" >
<input type="hidden" id="iteration" value="1"/>
</form>
<a href="page2.html" target="_blank" onclick="document.getElementById('createMessageForm').submit();return true;">Hello</a>

Answer 3

你的问题在这里？它基本上是Pointy所说的。取决于浏览器的实现。

如果你的问题是如何解决它只是改变

return true; into -> return false;

链接中的

Firefox和Safari中的javascript onclick行为有何不同？

3 个答案: