3

我在一个包含 3830 个元素的网页中有一个下拉列表。我知道，过度，但无论如何。

在 jquery 中，我使用以下语句获取选定的选项值：

$( "#institutionCombo :selected" ).val();

在找到选择之前有一个明显的停顿。一旦我得到那个值，我就把它插入到页面上的一个文本框中，所以我知道有多快。另外，我已经使用 Firebug 中的断点对其进行了检查。

如果我去老学校并使用这个javascript：

var div = document.getElementById("maindiv");
var select = div.getElementsByTagName("select")[0];
变量 ix = select.selectedIndex;
var instId = select.options[ ix ].value;

这个速度是瞬间的。

当数字变得太高时，jquery 中是否有一些继承会使 :selected 选择器变得如此缓慢？我想在我的脚本中始终使用 jquery，有没有人建议加快在 jquery 中找到选定的选项？

谢谢，

克雷格

4

2 回答 2

10

获取选择框的 val 时无需调用 :selected。

默认行为是获取 selectedIndex

$( "#institutionCombo").val();

如评论中所述，如果您需要访问该选项的文本，您可以使用

$( "#institutionCombo option[value=" + $( "#institutionCombo").val(); + "]").text();

虽然如果你知道你需要 text 属性并且它不同于你可能只想直接使用 selectedIndex 的值。

var combo = $("#institutionCombo").get(0); 
combo = combo ? combo : {selectedIndex: -1}; // handle no combo returned
if (combo.selectedIndex < 0)
  return; // nothing selected
$('#institutionCombo option:eq(' + combo.selectedIndex + ')').text()

这是来自 jquery 源代码的片段（v1.3）

val: function( value ) {
    // ...  
    // We need to handle select boxes special
    if ( jQuery.nodeName( elem, "select" ) ) {
        var index = elem.selectedIndex,
            values = [],
            options = elem.options,
            one = elem.type == "select-one";

        // Nothing was selected
        if ( index < 0 )
            return null;

        // Loop through all the selected options
        for ( var i = one ? index : 0, max = one ? index + 1 : options.length; i < max; i++ ) {
            var option = options[ i ];

            if ( option.selected ) {
                // Get the specifc value for the option
                value = jQuery(option).val();

                // We don't need an array for one selects
                if ( one )
                    return value;

                // Multi-Selects return an array
                values.push( value );
            }
        }

        return values;  
    // ...  
},

当您调用 :selected 选择器时，该选择器将遍历所有选择元素的后代，寻找要设置的 .selected 属性，并将返回一个任意数组。无论哪种方式，它都会循环所有后代，所以不要这样做。

于 2009-02-12T15:45:25.837 回答
0

你可以这样做：

var ix = $("#institutionCombo").attr("selectedIndex");

var value = $( "#institutionCombo 选项：eq(" + ix +")" ).val();

但是，这实际上就是您在老式代码中所做的事情。

我很惊讶有一个明显的延迟，因为我认为我上面所做的就是 jQuery 代码为 :selected 选择器所做的。

否则，我想知道是否是导致延迟的语法错误，您可能应该这样做

$("#institutionCombo 选项：选择").val();

（注意选项：selected vs :selected）

于 2009-02-12T14:19:23.157 回答