Question

我需要在bootstrap的popover中保留用户的下拉选择，直到它被清除。我已经使“selected”属性可以根据选择的更改动态更改，并使该更改替换HTML select元素。我认为一切正常（我通过警报功能看到它）。不幸的是，没有popover的“外观”，是的，当我检查它时，它与我得到的警报不匹配。

这是我的小提琴。谢谢。 http://jsfiddle.net/kDmVq/

$(document).on('shown', "#btnPopover", function () {
    $('select#optionDropdown').select2({
        allowClear: true
    }).change('#optionDropdown', function () {
        theID = $(this).val();
        theSelection = $(this).children('option:selected').text();
        $('#selectedID').text(theID);
        $('#selectedText').text(theSelection);
        $('#optionDropdown option').removeAttr("selected");
        $('option[value=' + theID + ']').attr("selected", "selected");
        optionDropdownRet = $('#optionDropdown').html();
    });
    alert($('#optionDropdown').html());
});

$(document).on('hide', "#btnPopover", function () {
    alert(optionDropdownRet);
    $('options#optionDropdown').replaceWith(optionDropdownRet);
});

Answer 1

我提出的解决方案涉及在隐藏的div和popover之间来回编写popover内容。通过在引导弹出事件之后向弹出窗口按钮添加一个单击事件侦听器，我可以在弹出窗口出现之后获取它并迭代表单元素......

$(document).ready(function() {

    $('#pop').popover({ 
        html : true,
        title: 'Popover',
        content: function() {
            html = $('#popover_content').html();
            return html;
        }
    });

    $('#pop').on('click', function (e) {
        initPopover();
    });

});

在弹出功能之后添加click事件侦听器的技巧。然后，在“initPopover”......

function initPopover() {
    var ishidden = true;
    if($('.popover').hasClass('in')) {
        ishidden = false;
    } else {
        ishidden = true;
    }

    if(ishidden == true) {

        var content = $('.popover-content');
        var html = content.html();

        $('#popover_content').html(html);

        $('#popover_content select').each(function(i){
            var sel = $('.popover-content select').eq(i).val();
            $(this).val(sel);
         });

    } else {

        $('.popover-content select').each(function(i){
            var sel = $('#popover_content select').eq(i).val();
            $(this).val(sel);
        })

        $('#popover_content').empty();  

    }

}

这是小提琴：http://jsfiddle.net/5NQ84/5/

如何在bootstrap的popover中保留下拉选择？

1 个答案: