2

以下のコードには、javascript を使用して新しいページに投稿する href とボタンがあります。href はクリックすると機能しますが、javascript を使用するボタンは数回クリックする必要があり、断続的に機能します。3回のクリックだけの場合もありますが、マウスをクリックする強さによっては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' を読み込もうとするだけでなく、リロードによって反応する現在のページにも POST を実行しています。

このデフォルトの動作を防ぐには、以下を .xmlreturn 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 に答える