選択したオプションに基づいてテキストを変更するにはどうすればよいですか？

Question

これはおそらく単純ですが、私はそれを解決することはできません。

どのオプションが選択されているかに基づいて、段落テキストを変更したいと考えています。

HTML

<form action=""> 
<select name="" id=""> 
    <option id="1" value="One">One</option> 
    <option id="2" value="Two">Two</option> 
    <option id="3" value="Three">Three</option> 
</select> 
</form> 
<br /> 
<p>Text</p> 

JQ

$("#1").click(function(){ 
$("p").html("Changed!"); 
}); 

ここではペンです：

https://codepen.io/anon/pen/qNawgv

Answer 1

あなたがクリックすることにより、オプションの要素をトリガすることはできません！ これはセレクタ要素とすべて関係しています。オプションが選択され、selecet要素が自動的に選択されたオプション要素の値を取得するかどうかをチェックします。

<form action=""> 
<select name="" id="slct"> 
    <option id="1" value="One">One</option> 
    <option id="2" value="Two">Two</option> 
    <option id="3" value="Three">Three</option> 
</select> 
</form> 
<br /> 
<p>Text</p> 

jQueryの

$('#slct').change(function(){ // when a option is selected 
    //$("p").html($('#slct').val()); // pushs html code in P element 
    $("p").text("Changed!"); 
    /* 
    anyway you should use $.text if you don't have HTML element to push in 
    */ 
});