如何自动设置下拉列表的大小?

时间:2012-09-30 14:14:48

标签: javascript web greasemonkey dom-manipulation

我正在尝试在Greasemonkey中编写一个脚本,该脚本将自动设置下拉列表的大小(可能有多个......),选择数量的选项,但是由于我有限的JavaScript知识,我不会真的知道怎么做。

主题的例子:

<select name="z_pos_id">
<option value="2463">Option A</option>
<option value="2609">Option B</option>
<option value="3013">Option C</option>
</select>

<select name="z_pos_id">
<option value="140">Option AA</option>
<option value="3038">Option AB</option>
<option value="3519">Option AC</option>
<option value="2645">Option AD</option>
</select>

所需输出的示例:

<select size="3" name="z_pos_id">
<option value="2463">Option A</option>
<option value="2609">Option B</option>
<option value="3013">Option C</option>
</select>

<select size="4" name="z_pos_id">
<option value="140">Option AA</option>
<option value="3038">Option AB</option>
<option value="3519">Option AC</option>
<option value="2645">Option AD</option>
</select>


因此,<select name="z_pos_id">应该替换为:

<select size="*the number of options*" name="z_pos_id">

谢谢大家的帮助!

2 个答案:

答案 0 :(得分:1)

这是一个完整的脚本。它应该是相当自我解释的:

// ==UserScript==
// @name     _Auto-size select selects.
// @include  http://YOUR_SERVER.COM/YOUR_PATH/*
// @grant    none
// ==/UserScript==

var posIdSelects = document.querySelectorAll ("select[name=z_pos_id]");
for (var J = posIdSelects.length - 1;  J >= 0;  --J) {
    var numOpts  = posIdSelects[J].getElementsByTagName ("option").length;
    posIdSelects[J].setAttribute ("size", numOpts);
}

答案 1 :(得分:1)

$(document).ready(function() {
    var ln = $("select[name=z_pos_id] option").length ;
    alert(ln); // you can delete this alert after your test
        $("select[name=z_pos_id]").attr('size', ln);
});