在bootstrap multiselect上调用$(this)

时间:2017-05-11 10:26:23

标签: jquery twitter-bootstrap

我设法显示了一个bootstrap multiselect。我遇到了麻烦。 当select关闭时,我希望我可以调用$(this)。

请帮帮我。

修改

for (var akun in data_akun){
    $( '#select_akun'+data_akun[akun]['id'] ).multiselect({
        includeSelectAllOption: true,
        onDropdownHide: function(event) {
            alert( $(this).attr('current-attribute') );
        }
    })
}

2 个答案:

答案 0 :(得分:2)

试试这个会帮到你

for (var akun in data_akun){
    var $this = $( '#select_akun'+data_akun[akun]['id'] );
    $this.multiselect({
        includeSelectAllOption: true,
        onDropdownHide: function(event) {
            alert( $this.attr('current-attribute') );
        }
    })
}

答案 1 :(得分:1)

基本上在onDropdownHide的情况下,我们不会直接获得element引用。所以为了得到它我们可以使用以下方法。 Bootstrap multiselect生成自己的DOM结构并设置原始<select>框的样式。为显示目的生成的任何DOM都会插入到原始<select>框的旁边和旁边。请使用浏览器开发工具的inspect元素功能来检查生成的DOM。

$(document).ready(function() {
       $('.example-getting-started').multiselect({
        includeSelectAllOption: true,
        onDropdownHide: function(event) {
            var selectObj = $(event.target).prev("select");
            alert( $(selectObj).attr('current-attribute') );
        }
    });
 });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
<!-- Latest compiled and minified JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>

<link rel="stylesheet" href="http://davidstutz.github.io/bootstrap-multiselect/dist/css/bootstrap-multiselect.css" type="text/css">

<script type="text/javascript" src="http://davidstutz.github.io/bootstrap-multiselect/dist/js/bootstrap-multiselect.js"></script>

<select class="example-getting-started" current-attribute='hello'>
    <option value="cheese">Cheese</option>
    <option value="tomatoes">Tomatoes</option>
    <option value="mozarella">Mozzarella</option>
    <option value="mushrooms">Mushrooms</option>
    <option value="pepperoni">Pepperoni</option>
    <option value="onions">Onions</option>
</select>

<select class="example-getting-started" current-attribute='world'>
    <option value="cheese">Cheese</option>
    <option value="tomatoes">Tomatoes</option>
    <option value="mozarella">Mozzarella</option>
    <option value="mushrooms">Mushrooms</option>
    <option value="pepperoni">Pepperoni</option>
    <option value="onions">Onions</option>
</select>