※ ChatGPTを利用し、要約された質問です（原文：<form>タグ内の再読み込みに関して）
formタグの再読み込みに関する問題
このQ&Aのポイント
formタグがあると画像の変更が即座に戻ってしまう理由
formタグの内部でも再読み込みの制御はできないのか
実行環境はWindows8Pro、VisualStudio2012、Windowsストアアプリ開発プロジェクト内のデバッグ
以下のようなhtmlファイルがあったとします。
※<body>タグ内以外は省略
-------------------------------------------------
<body onload="bodyload()">
<form>
<input id="id_button1" type="image" value="button" name="n_button1" onclick="click();">
</form>
</body>
-------------------------------------------------
呼び出されるjavascriptを以下の通りとします
-------------------------------------------------
function bodyload()
{
document.getElementById('id_button1').src = '/images/base.png'
}
function click()
{
document.getElementById('id_button1').src = '/images/1.png'
}
-------------------------------------------------
id_button1のクリックによって、click()が動作し画像が「/images/1.png」に変更されるのですが、
一瞬で「/images/base.png」に戻ってしまいます。色々試したところhtmlファイルの<form>タグを
消してやれば「/images/base.png」に戻ることなく画像を変更することが可能であることに気づき
ました。
どうやらformタグがあると再読み込みが行われているようです。
formタグがあると何故このような動きをするのでしょうか？ formタグ内でも再読み込みの有無を
制御することはできないのでしょうか？お分かりになる方がいらっしゃればご教授いただければ
と思います。
javascriptというよりhtmlの内容かもしれませんがよろしくお願いいたします。
なお、実行環境はWindows8Pro、VisualStudio2012、Windowsストアアプリ開発プロジェクト内のデバッグです。
お礼
なるほど、submitですか。 言われた通り、<img>で解消しました。 ありがとうございました