Javascript 我的脚本适用于当前的jquery 1.11.1，但不适用于1.7.1。为什么？ //选择框 $（函数（）{ 函数选择框（widgetSelector、Options ContainerSelector、Options Selector、SelectedOptions Selector、SelectedOptions ClassName、selectorClassName）{ var target=widgetSelector； 函数初始化（）{ var小部件=$（此）； var selectboxNamespace=widget.data（'selectbox-ns'）； var options=optionsContainerSelector；//包含选项的容器 var option=optionSelector；//选项直接嵌套在选项容器中 var selected=selectedOptionSelector；//这是要设置样式的选择器，在selectbox的任何时候都不可见 var selectedOption=selectedOptionClassName；//此类是机械类，但用于允许用户在占位符弹出到选定区域后直观地跟踪选定的项目 var selector=selectorClassName；//将选择器开关设置为本地变量以供重用 函数closeAllOptions（event）{//用于模糊和散焦selectbox小部件的任何入口 //此部分用于重置占位符或选择文本（取决于是否确实选择了某个项目） $（选项）.hide（）；//隐藏选项容器的所有入口 $（目标）.children（）.children（选中）.each（函数（）{//遍历每个函数 $（this.html（$（this.parent（）.parent（）.children（options）.children（'..+selectedOption）.html（）） //将选定类innerHTML的每个实例设置为selectedOption类的实例（如果已选择） }); } 功能关闭选项（事件）{ $（选项）.hide（）； //选择一个项目后，我们将关闭选项容器中的所有实例 } 函数插入占位符（）{ //我们将在以下（2）次中再次使用此选项 widget.children（）.children（selected）.html（widget.children（）.children（selected）.data（'placeholder'）； } injectPlaceholder（）；//确保初始内容在加载时应该在的位置 功能切换选项（事件）{ //这个=.options if（widget.children（options）.is（':visible'）{//如果selectbox打开 widget.children（options.hide（）；//根据函数的调用位置隐藏选项 widget.children（） }else{//如果selectbox已关闭 $（选项）.hide（）//隐藏所有选项（所有实例） widget.children（options）.show（）；//显示此特定实例 injectPlaceholder（）；//injectPlaceholder被envoked的另一个时间（） } event.stopPropagation（）；//阻止事件进一步冒泡DOM } 函数selectOption（事件）{//从现在可见的选项容器中选择一个选项 //this=.选项 var reqOption=$（this）.html（）；//存储所选的选项内容 var reqData=$（this）.attr（'data-value'）；//存储所选选项保留的值 widget.children（options）.children（option）.removeClass（selectedOption）//此类是机械类，但用于允许用户在占位符弹出到选定区域后直观地跟踪选定的项目 $（this）.addClass（selectedOption）；//用于跟踪 widget.children（） widget.children（）.children（selected）.attr（'data-value'，reqData）//附加一个与所选选项的值匹配的数据属性 $（'.test box'）.append（已选择selectboxNamespace+'，并且'+'报告其所选值：'+reqData+'，'+'，，因为用户选择的选项为：'+'“'+reqOption+'”）； event.stopPropagation（）；//阻止事件在DOM中冒泡 closeOptions（）；//选择一个项目并完成其余操作后关闭选项。。。 } //绑定我们的事件处理程序 $（此）.on（'click'，option，selectOption）//如果单击了一个选项->selectOption（） $（this）.on（'click'，toggleOptions）//如果单击了选项容器->toggleOption（） $（this）.on（'click'，selector，toggleOptions）//如果单击了selector元素->toggleOptions（） $（'html'）。在（'click'，closeAllOptions）//如果小部件模糊/散焦->closeAllOptions } $（目标）.each（初始化）//将此功能应用于选择框的每个实例 } window.selectbox=selectbox（'.selectbox'，'.options'，'.option'，'.selected'，selected option'，'.selector'）； //API:widgetSelector、Options ContainerSelector、Options Selector、SelectedOptions Selector、SelectedOptions classname、selectorClassName）最后一个参数必须是类名（任何类名） });

以下是我设法满足的小部件要求：

如果在所有状态中未选择任何内容，则必须保留占位符（单击然后单击选择器以不选择实际选项，占位符内容应保留）

当选项菜单打开时，它应显示占位符指令作为所选选项文本，但是一旦菜单收缩或切换，它应显示所选文本（如果有）

选择框必须在模糊时关闭，也必须在选择小部件的另一个实例时关闭

Obv它必须抓住一个

    // selectbox
    $(function() {
    function selectbox(widgetSelector, optionsContainerSelector, optionsSelector, selectedOptionSelector, selectedOptionClassName, selectorClassName) {
        var target = widgetSelector;


        function initialize() {
            var widget = $(this);
            var selectboxNamespace = widget.data('selectbox-ns');
            var options = optionsContainerSelector; // The container which contains the options 
            var option = optionsSelector; // The options nested directly inside the options container
            var selected = selectedOptionSelector; // This is the selector you will style, no visible at all times portion of the selectbox
            var selectedOption = selectedOptionClassName; // This class is mechanical but be used to allow the user to visually track the item which is selected once the placeholder pops back into the selected region 
            var selector = selectorClassName; // Set the selector switch to a local var for reuse
            function closeAllOptions(event) { // For blurring and defocus of any intances of  the selectbox widget
                // This portion is for reseting the placeholder or selection text (depending if an items has indeed been selected yet)
                $(options).hide(); // Hide all intances of the options container
                $(target).children().children(selected).each(function(){ // Iterate through each one 
                    $(this).html( $(this).parent().parent().children(options).children('.'+selectedOption).html() )
                    // Set each instance of the selected class innerHTML to that of the selectedOption class if one has been selected 
                });
            }
            function closeOptions(event) {
                $(options).hide();

                // When the an item is selected, we'll close all instances the options container
            }
            function injectPlaceholder() {
                // We will use this again below (2) times
                widget.children().children(selected).html(widget.children().children(selected).data('placeholder'));
            }
            injectPlaceholder(); // Ensure the initial content is where it should be on load
            function toggleOptions(event) {
                // this = .options
                if (widget.children(options).is(':visible')) { // If selectbox is opened
                    widget.children(options).hide(); // Hide the options based on where the function was envoked from
                    widget.children().children(selected).html(widget.children(options).children('.' + selectedOption).html())
                } else { // if selectbox is closed
                    $(options).hide() // Hide all options (all instances)
                    widget.children(options).show(); // Show this particular instance
                    injectPlaceholder(); // Another time where injectPlaceholder is envoked()
                }
                event.stopPropagation(); // Stop the event from bubbling up the DOM further
            }

            function selectOption(event) { // Selecting an option from the now visible options container
                // this = .option
                var reqOption = $(this).html(); // Store the option content that was selected
                var reqData = $(this).attr('data-value'); // Store the value held by the option selected
                widget.children(options).children(option).removeClass(selectedOption) // This class is mechanical but be used to allow the user to visually track the item which is selected once the placeholder pops back into the selected region 
                $(this).addClass(selectedOption); // for tracking purposes
                widget.children().children(selected).html(reqOption) // Insert the selected options data into the 'selected'/selection area
                widget.children().children(selected).attr('data-value', reqData) // Append a data-attribute matching the value of the option selected
                $('.test-box').append(selectboxNamespace + ' was selected and ' + 'reports its selected value: ' + reqData + ',' + ' because the user selected the option reading: ' + '"' + reqOption + '"<br />');
                event.stopPropagation(); // Stop the event from bubbling up the DOM
                 closeOptions(); // Close options after an item is selected and the rest is done...
            }
            // Bind our event handlers
            $(this).on('click', option, selectOption) // If an option is clicked -> selectOption()
            $(this).on('click', toggleOptions) // If the options container is clicked -> toggleOption()
            $(this).on('click', selector, toggleOptions) // If the selector element is clicked -> toggleOptions()
            $('html').on('click', closeAllOptions) // If the  widget is blurred/defocused -> closeAllOptions
        }

        $(target).each(initialize) // Apply this functionality to each instance of the select box
    }
    window.selectbox = selectbox('.selectbox', '.options', '.option', '.selected', 'selected-option', '.selector');
    // API : widgetSelector, optionsContainerSelector, optionsSelector, selectedOptionSelector, selectedOptionClassName, selectorClassName ) The last param must be a class name (any classname)
    });

line 25:  .html( $('.selected-option').html() )

line 25:        .html( $(this).children(selected).html() )