如何通过类名统一初始化多个jQuery Select2下拉框？

直接把jQuery选择器从单个ID替换成你定义的共享类名.ddlvalue即可，这样所有带有该类的下拉框都会自动应用Select2的配置，无需重复编写初始化代码。

修改后的JavaScript代码：

$(function() {
  // 用类名选择所有需要初始化的下拉框
  $(".ddlvalue").select2({
    tags: true,
    createTag: function(params) {
      return {
        id: params.term,
        text: params.term,
        newOption: true
      }
    },
    templateResult: function(data) {
      var $result = $("<span></span>");

      $result.text(data.text);

      if (data.newOption) {
        $result.append(" <em>(new)</em>");
      }

      return $result;
    }
  });
});

你的HTML代码已经给所有需要初始化的<select>标签加上了ddlvalue类，所以不需要修改HTML部分。这样执行后，ddlSection和ddlCustomer这两个下拉框都会拥有相同的Select2功能。如果之后需要新增同类下拉框，只需要给对应的<select>加上ddlvalue类即可，不用再修改JS代码。

内容的提问来源于stack exchange，提问作者Anjali