2011-10-28 23 views
1

私はselect要素でjavascriptを使用してonchangeイベントを作成しようとしています。しかし、それは動作していない、私は何を間違っているのヒント?Javascript onchange select not working

スクリプト..

<script type="text/javascript"> 
function check() { 
    alert("Hi"); 
} 
</script> 

HTML ..

<body> 
<select name="selTitle" id="titles" onchange="check();"> 
<option value="Mr.">Mr.</option> 
<option value="Ms.">Ms.</option> 
</select> 
</body> 

デモ - http://jsfiddle.net/jq9UA/1/

+0

? –

+0

あなたの提供されたコードが私に役立ちました。私はヘッダータグにスクリプトを含めていません。 –

+0

@ Vikas-理由は分かりません。私の場合は、スクリプトが頭の中にある場合にのみ動作します。 –

答えて

6

フィドルでの問題は、JavaScriptコードは、ウィンドウのロードイベントに応答して実行されていることです(バイディング時のデフォルト)。実行するコードは、ロードコールバックのコンテキストで定義され、グローバルスコープでは定義されません。あなたは、フレームの実際の生成されたHTMLに目を通している場合、あなたはそれはこれはあなたのコードは、ロード・コールバックに対してローカルですが、イベント・ハンドラは、グローバルに定義を起動したいcheck機能を定義する意味この

$(window).load(function(){ 
    function check() { 
    alert("Hi"); 
    } 

}); 

のように見えるでしょうcheck機能。

この問題を解決するには、グローバルコンテキストでJavaScriptを定義するフィドル設定の1つを使用する必要があります。 "ラップしない(頭)"を試してください。

フィドル:http://jsfiddle.net/jq9UA/3/

+0

@ JaredPar-それは動作しますが、私はあなたがどのようにフィドルでそれを行うかを知っていません。コードは似ています。 –

+1

@Buxme:左側の設定を見てください( 'no wrap(head)')。 –

+0

見つけた..ありがとう。 –

0

私はこれをテストし、完全に正常に動作しています:

スクリプトはHTMLドキュメントをマージしない
<script name="text/javascript"> 
    function check() { 
     alert("Hi"); 
    } 
</script>  

<body> 
<select name="selTitle" id="titles" onchange="check();"> 
<option value="Mr." value="1">Mr.</option> 
<option value="Ms." value="2">Ms.</option> 
</select> 
</body>