如何在JS文件

时间:2016-08-03 12:41:36

标签: javascript jquery

我有一些在我的页面上动态生成的选择菜单,我想用kartik select2替换所有HTML5选择菜单,在第一个选择菜单下面的图像是静态的,我只是把select2放在我的php中表单中的另一个是动态的我通过单击添加按钮生成它们,现在我想将HTML5选择更改为kartik select2,我该如何实现。   enter image description here

function addColor(){
   var div = $(

    '<div class="col-md-offset-3 color2" style="padding-left:15px; border:1px solid red;">'+
        '<div class="row">'+
            '<div class="col-md-5" >'+
                    '<div class=""><span class="text-muted">Color</span></div>'+
                   //'<div class="list-title-input"><input type="text" placeholder="Enter color!" ></div>'+
             $("select").select2({

标签:“true”,   占位符:“选择一个选项”,   allowClear:true   })+

            '</div>'+
            '<div class="col-md-5" >'+
                      '<div class=""><span class="text-muted">Color photo</span></div>'+
                      '<div class="btn btn-success fileUpload float-left" style="width:40px; height:35px;">'+
                            '<span ><i class="glyphicon glyphicon-plus" ></i></span>'+
                            "<input type='file' class='upload addPhoto' id='addPhoto'>&nbsp;&nbsp;"+
                      '</div>'+
                      //"<div class=\"color-image\"><img src="+url+name+" class=\"img img-thumbnail\"></div>"+
            '<div class="addMore" style="float:left; margin-left: 10px;"><a href="javascrip::void();">Add more</a></div>'+
            '&nbsp;&nbsp;<span class="remove" style="float:left; margin-left: 10px;"><a href="javascrip::void();">Remove</a></span>'+
            '</div>'+
        '</div>'+
     '</div>'
     );
    $(".color1").append(div);
}

我想将代码中的select选项更改为kartik select2我试过这种方式但没有运气。我在select标签中添加了class select2,我添加了这段代码

 $("#id").select2({
  tags: "true",
  placeholder: "Select an option",
  allowClear: true
  });

1 个答案:

答案 0 :(得分:0)

请更改您的js代码

$(".common class").select2({
  tags: "true",
  placeholder: "Select an option",
  allowClear: true
});

或者

$("select").select2({
  tags: "true",
  placeholder: "Select an option",
  allowClear: true
});