3

考虑以下代码：

索引.html

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" 
    "http://www.w3.org/TR/html4/strict.dtd">
<html>
    <head>
        <script type="text/javascript" src="script.js"></script>
    </head>

    <body>
        <form>
            <button id="getInfoButton1"></button>
            <input type="button" id="getInfoButton2"></input>
        </form>
    </body>
</html>

使用随附的 JavaScript 文件：

脚本.js

window.onload = initAll;
var req;

function initAll()
{
    document.getElementById("getInfoButton1").onclick = getInfo;
    document.getElementById("getInfoButton2").onclick = getInfo;
}

function getInfo()
{
    req = new XMLHttpRequest();
    var URL = "index.html";
    req.open("GET", URL, true);
    req.onreadystatechange = whatsTheStatus;
    req.send(null);
}

function whatsTheStatus()
{
    if (req.readyState != 4) { return; }
    alert(req.status);
}

（我已经减少了很多代码，但是这个例子仍然突出了错误）

问题是这样的：当您加载它并单击两个按钮时，第一个将显示状态0，而第二个将显示状态200。

当然，我希望两者都显示200，我不知道为什么<button>行为不同。这不是什么大不了的事，但我想<button>在我的整个网站上保持相同的使用。

我浏览了网络并询问了我公司的其他一些开发人员，但我们似乎找不到答案。有任何想法吗？

如果有帮助，我正在 Firefox 3.6.8 上进行测试。另外，我通过 WAMPserver 2.0 从 localhost 运行它。

4

1 回答 1

7

您需要<button type="button">重现<input type="button">.

如果您省略其类型，<button>则默认为submit（由于错误而在 IE<8 上除外；因此，您应该始终type在 上使用属性<button>）。提交按钮会导致表单提交，导致导航并取消 XMLHttpRequest。

通常，您应该onsubmit在表单上而不是onclick在特定按钮上进行捕获，以确保您始终在表单是通过其他方式提交时得到通知，例如按下 Enter 键。（因此，您将使用普通submit按钮。）return false从事件处理程序中使用以防止表单提交继续进行。

于 2010-07-27T22:48:48.897 回答