2

在下面的代码中，我有一个 href 和一个使用 javascript 发布到新页面的按钮。当我单击它时，href 有效，但使用 javascript 的按钮需要多次单击并且间歇性地工作。有时只需点击三下，但可能高达 19 次点击，具体取决于我点击鼠标的力度:)

任何想法为什么这些行为不同？

<head>
    <script type="text/javascript">
        function myFunction() {
            window.location.href = 'tournaments.aspx';
        }
    </script>
</head>
<body>
<form>
<div style="width:400px; height: 600px; border: 1px solid black;" align="center" >
    <div>
        <input type="image" name="ctl02" src="Images/Advertisement.png" />
    </div>
    <div>
        <input type="image" name="ctl03" src="Images/ISETLogo.png" />
    </div>
    <div >
        <button onclick="myFunction()">Click me</button>
        <a href="tournaments.aspx">tournaments</a>
    </div>
</div>
</form>

4

1 回答 1

9

这可能是因为您在标签中有一个按钮，<form>默认情况下会在单击时尝试提交表单。因此，除了尝试在当前窗口中加载“tournaments.aspx”之外，您还可以发布到当前页面，该页面将通过重新加载做出反应。

要防止这种默认行为，return false;请在您的onclick:

<head>
    <script type="text/javascript">
        function myFunction() {
            window.location.href = 'tournaments.aspx';           
        }
    </script>
</head>
<body>
<form>
<div style="width:400px; height: 600px; border: 1px solid black;" align="center" >
    <div>
        <input type="image" name="ctl02" src="Images/Advertisement.png" />
    </div>
    <div>
        <input type="image" name="ctl03" src="Images/ISETLogo.png" />
    </div>
    <div >
        <button onclick="myFunction(); return false;">Click me</button>
        <a href="tournaments.aspx">tournaments</a>
    </div>
</div>
</form>
</body>
于 2013-01-23T17:54:56.913 回答