如何根据选择的选项更改文本?

时间:2016-06-21 00:27:11

标签: jquery

这可能很简单,但我无法解决。

我希望能够根据选择的选项更改某些段落文本。

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

1 个答案:

答案 0 :(得分: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
  */
});