1

我需要在引导程序的弹出窗口中保留用户的下拉选择,直到它被清除。我已经使“selected”属性可以根据选择的更改动态更改,并让该更改替换 HTML select 元素。我认为一切正常(我通过警报功能看到它)。不幸的是,不是弹出框的“外观”,是的,当我检查它时,它与我得到的警报不匹配。

这是我的小提琴。谢谢你。 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);
});
4

1 回答 1

1

我想出的解决方案涉及在隐藏的 div 和弹出框之间来回编写弹出框内容。通过在引导弹出事件之后向弹出按钮添加一个单击事件侦听器,我能够在弹出内容出现后访问它并遍历表单元素......

$(document).ready(function() {

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

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

});

诀窍是在弹出功能之后添加点击事件侦听器。然后,在“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/

于 2014-07-17T15:34:26.053 回答