Javascript 如何将事件与选择框的选项id关联

在选择框中的特定选项后，我必须向页面添加

div

元素。我如何使用jQuery来实现它？我试图使用

onClick

事件，但它不起作用

<div class="col-xs-7">
    <label for="sel1">Filter Type:</label>
    <select class="form-control" id="sel1">
        <option>Text</option>
        <option onclick="Adddivision();">List</option>  
    </select>
</div>
<script>
  function Adddivision(){

      <div class="col-xs-6">
      <label for="Filter Options">Filter Options:</label>
      </div>    
  }
</script>

过滤器类型：
正文
列表
函数Adddivision（）{
过滤器选项：
}

您可以使用：

$('#sel1').on('change', function() {
  if($(this).find('option:selected').text()=="List" ){
     $('body').append('<div class="col-xs-6"><label for="Filter Options">Filter Options:</label></div>')//append div
     $('#sel1').off('change');
  }
});

$（'sel1'）。在（'change'，function（）上{
if（$（this）.find（'option:selected'）。text（）=“List”）{
$（'body'）.append（'Filter Options:'）//append div
$（'sel1'）。关闭（'change'）；
}
});

您可以使用下面的jQuery绑定

更改

事件选择框，并检查所选选项是否为

列表

，然后将标签附加到div

$('#sel1').on('change', function() {
  var text = $(this).find('option:selected').text();
  if(text =="List" );
   {
    $(".col-xs-6").append('<label for="Filter Options">Filter Options:</label>');
   }
});

$（'sel1'）。在（'change'，function（）上{
var text=$（this）.find（'option:selected'）.text（）；
如果（文本=“列表”）；
{
$（.col-xs-6”）.append（'Filter Options:'）；
}
});

使用onchange jQuery事件

$(document).on("change", "#sel1", function(){
 if($(this).val() == 2) // 2 is the value of the <option> tag
 {
 var divElement = "<div>The Div Element that you want to be appended to your page</div>";
   $("body").append(divElement);
}
});

$（document）.on（“change”，“#sel1”，function（））{
if（$（this）.val（）==2）//2是标记的值
{
var divElement=“要附加到页面的Div元素”；
$（“正文”）.append（divElement）；
}
});

Hi@Edward这不是JQuery，也不是有效的Javascript。只是我知道答案将由JQuery给出如果你不希望答案是JQuery，那么你应该在指定选项值2的问题中明确写出来？我想你可以比较选项的文本。如果你的页面被翻译成其他语言（比如法语），你会怎么做。你的代码会工作吗？无论何时使用，请选择标记的“值”属性。text选项1 text除此之外，上的整数比较比带string的更快谢谢你们的回复，你们有惊人的编码技巧