jquery – 选择与bootstrap 3不能正常工作

前端之家收集整理的这篇文章主要介绍了jquery – 选择与bootstrap 3不能正常工作前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我有这个代码,触发一个引导模式并通过$ .load()加载它的内容。我加载的页面有一个选择元素,我打电话选择。
这里是代码
$('.someClick').click(function(e){
   e.preventDefault();
   x.modal('show');
   x.find('.modal-body').load('path/page.html',function(response,status,xhr){

       if(status =="success")
        $("select[name=elementName]").chosen();

    });
});

我得到的结果是如下图所示:

这是我的Html内容

<select name="elementName" data-placeholder="Please work.." class="chosen-select">
        <option value="test">Hi</option>
        <option value="test2">bye</option>
 </select>

解决方法

显示模态后应用选择应该可以解决您的问题:
$('#myModal').on('shown.bs.modal',function () {
  $('.chosen-select',this).chosen();
});

或者当选择已经应用时,销毁和重新应用:

$('#myModal').on('shown.bs.modal',this).chosen('destroy').chosen();
});

这里翻转:http://jsfiddle.net/koenpunt/W6dZV/

所以在你的情况下,它可能会像:

$('.someClick').click(function(e){
   e.preventDefault();
   x.modal('show');
   x.on('shown.bs.modal',function(){
       x.find('.modal-body').load('path/page.html',xhr){
           if(status == "success"){
               $("select[name=elementName]").chosen();
           }
       });
   });
});

编辑

补充选择你可以使用Chosen Bootstrap theme

原文链接:https://www.f2er.com/jquery/183724.html

猜你在找的jQuery相关文章