2011-12-29 31 views
0

私はjavascriptが初めてです。ここにコードがあります基本的なJavaScriptのイベント

<script> 
function text_input_type(type) 
{ 
if(type=='list'){ 
document.getElementById("note_input").innerHTML="<input type=\"text\" name=\"body\">"; 
} 
else{ 
document.getElementById("note_input").innerHTML="<textarea id=\"note_input\" name=\"body\" cols=\"27\" rows=\"5\"></textarea>"; 
} 
} 

</script> 

<textarea id="note_input" name="body" cols="27" rows="5"></textarea> 
<input type="radio" name="type" value="text" onclick=text_input_type('list') /> 
<input type="radio" name="type" value="list" onclick=text_input_type('text') /> 

あなたが押すラジオボタンによって、テキストエリアから入力テキストタイプに変わるようにしたいと思います。問題は、入力をテキストボックスから小さなテキスト入力に変更する代わりに、ボックス内のコードを出力するだけです。

+0

あなたが直面している問題は何ですか? – AmGates

+0

イベントは発生してはいけません。 DOM内のイベントに関数を代入しているときに引用符を忘れた – Anand

+0

ああ、残念です。私はそれを加えた。 –

答えて

1

が、これはあなたの問題を解決するには、あなたのお役に立てば幸いです。

<script> 
    function text_input_type(type) 
    { 
    if(type=='list'){ 
    document.getElementById("note_input").innerHTML="<input type=\"text\" id=\"note_input1\" name=\"body\">"; 
    } 
    else{ 
    document.getElementById("note_input").innerHTML="<textarea id=\"note_input1\" name=\"body\" cols=\"27\" rows=\"5\"></textarea>"; 
    } 
    } 

    </script> 

    <div id="note_input"><textarea id="note_input1" name="body" cols="27" rows="5"></textarea></div> 
    <input type="radio" name="type" value="text" onclick=text_input_type('list') /> 
    <input type="radio" name="type" value="list" onclick=text_input_type('text') /> 

このコードを試してみてください。

0

小さな変更を除いて、コードは正しいです。

<html> 
<body> 
<input type="radio" name="type" value="text" onclick="text_input_type('list');" /> 
<input type="radio" name="type" value="list" onclick="text_input_type('text');" /> 
<div id="note_input"> 
</body> 
</html> 

も—インラインJavascriptが本当に必要ではありませんJavaScriptを使用して微

0

バインドにクリックハンドラを動作するはずです:

var elems = [].slice.call(document.getElementsByTagName("input")); 
elems.forEach(function(elem){ 
    elem.onclick = function(){ 
     var type = this.value; 
     if(type === 'list'){ 
      alert("type is list"); 
     } else { 
      alert("type is not list"); 
     } 
    }; 
}); 

Exampleを。

私はこれが少し複雑かもしれないことを知っています。私たちがやっていることは、ページ上の各入力タグにクリック機能を付けることです。クリックされた入力のvalueを変数typeに設定し、変数が文字列listと等しいかどうかを確認します。そうであれば、ifにコードを発行します。そうでない場合は、elseにコードを発行します。

これは基本的にはあなたのために簡単です。あなたはJSファイルにこのコードを入れて、要素自体にonclickを割り当てることについて心配する必要はありません。

あなたが引用符でonclickを囲む場合は、あなたのコードはそうと同じように、動作します:

onclick="text_input_type('list');"