IEで、return 0; をすると 画面に0が表示されてしまいます。

質問

IEで、return 0; をすると 画面に0が表示されてしまいます。

あるJavascriptのプログラムをIEで動かしたところ、関数中で
return 0;
をしたときに画面に0だけが表示されてしまいます。

どうしてこのようなことが起こるのでしょうか？
また、その対策も教えてください。

ちなみにIE8で、return false; でも同じ現象が起こり、0, false 以外ではそのような現象は起こりませんでした。

回答No.4

yambejp · ベストアンサー

hrefで実行したいならvoidで受けた方がよいですね。
普通は、onclickで処理すると思いますが・・・

<script>
function func1(){
alert("hello");
return false;
}
function func2(){
alert("hello");
return true;
}
</script>

<a href="javascript:void(func1())"> func1-1 </a><br>
<a href="#" onclick="return func1()"> func1-2 </a><br>
<a href="javascript:void(func2())"> func2-1 </a><br>
<a href="#" onclick="return func2()"> func2-2 </a><br>

※この場合2-2だけがページの遷移が発生します。

回答No.6

yyr446

どうしてこのようなことが起こるのでしょうか？
＝＞理由も一応見つけました。
（Gecko系ブラウザーの仕様ですが、IEもたぶん同様）
https://developer.mozilla.org/en/JavaScript/Reference/Operators/Special_Operators/void_Operator

「When a browser follows a javascript: URI, it evaluates the code in the URI and then replaces the contents of the page with the returned value, unless the returned value is undefined. The void operator can be used to return undefined. For example:」

つまり、<a href=#javascript: は、
javascript:の後ろの部分をjavascriptとして実行し、コンテンツをリターン値に
置き換える。ただし、リターン値がundefinedの場合は除く
という事でした。

従って、void(0)というのは、常にundefined を返しますから、No.2の対策でOK
だと思います。

ちなみに、<a href=#javascript:～に、ごちゃごちゃSCRIPTを書くと時は、
URIエンコードしないと、おもいどおりにならない事がままあるそうな...

お礼

なるほど。詳しい解説ありがとうございます。

それにしても、ブラウザによって実行結果が変わってしまうのは困り者ですよね。
回答ありがとうございました。

回答No.5

think49

質問者さんの書かれている内容は下記と同じです。

<p><a href="javascript:0">javascript:0</a></p>
<p><a href="javascript:false">javascript:false</a></p>
<p><a href="javascript:true">javascript:true</a></p>

> また、その対策も教えてください。
この場合、a要素である必然性はないので、span要素に変更するのが良いと思います。

<span onclick="func();">func</span>

> ちなみにIE8で、return false; でも同じ現象が起こり、0, false 以外ではそのような現象は起こりませんでした。
私の環境では、true でも再現できました。

お礼

回答ありがとうございました。

たしかに<a>を使う必要性はなかったのかなーと思いました。
見直してみようと思います。

回答No.3

yyr446

そおいうことでしたか、対策は
<a href="javascript:void(0);" onclick="func();"> click me ! </a>
ですね。

お礼

回答ありがとうございました！

今回はどうしても<a>を使う必要があったので、参考になりました。
自分的には、すごく納得しました。
(今まで、href="#" とするのがどうも納得がいきませんでした)

javascriptはできるだけonclickに書くようにした方がいいですね。
ありがとうございました

回答No.2

yyr446

0, false 以外ではそのような現象は起こりませんでした。

＝＞念押し、return true;としても、その現象は絶対起こらないんですね！・

回答No.1

yambejp

具体的な例示をしてみてください。
（おそらく勘違いだとおもいますが）

補足

/*javascript---------------------*/
function func(){
alert("hello");
return 0;
}

/*html-------------------------*/
<a href="javascript:func();"> click me ! </a>

のような感じで書きました。