打开与选择关联的选项框 [英] open the options box associated with a select

问题描述

我有一个名为s的选择在一个名为f的形式中：


默认情况下，页面上只显示选择中的一个选项 -

这就是我想要的它。


我想做的是模拟选择的点击，以便所有的选项变得可见 - 即，它的选项选项框打开，显示所有

document.fsoptions.length选项。


我尝试过以下方法：

1. document.fsoptions [k] .selected = true

2. document.fsfocus（）

3. document.fsclick（）

4. document.fssize = document.fsoptions.length

1.成功更改可见的选项，但保留

显示的数字不变

2.突出显示当前可见的选项 - 表示焦点已经收到

收到

3.似乎什么都不做

4.这会改变可见矩形的大小，并且除了其他选项出现之外，它是我想要的b $ b b。在选择'的先前

矩形之上（因此破坏现存的页面布局）而不是允许

其他选项下拉当物理上点击选择时会发生以下情况。


我可能只需要构建一个小部件来做到这一点，但是想到有人

可能知道实现此行为的正确方法。


TIA

ddailey

I have a select named "s" in a form named "f":

By default only one of the options in the select appears on the page --
that is how I want it.

What I''d like to do is simulate a click on the select so that all of
its options become visible -- i.e., its option box opens to reveal all
document.f.s.options.length options.

I''ve tried the following:
1. document.f.s.options[k].selected=true
2. document.f.s.focus()
3. document.f.s.click()
4. document.f.s.size=document.f.s.options.length
1. succeeds in changing the option which is visible but leaves the
displayed number unchanged
2. highlights the currently visible option-- indicating focus has been
received
3. appears to do nothing
4. this changes the size of the visible rectangle, and is sort of what
I want, except that the other options appear above the select''s prior
rectangle (hence disrupting extant page layout) rather than allowing
the other options to "drop down" below as should happen when physically
clicking on a select.

I might just have to build a widget to do this, but thought someone
might know of the proper method for effecting this behavior.

TIA
ddailey

推荐答案

" ddailey" <峰; dd ***** @ zoominternet.net>在消息中写道

news：11 ********************** @ t31g2000cwb.googlegr oups.com ...

"ddailey" <dd*****@zoominternet.net> wrote in message
news:11**********************@t31g2000cwb.googlegr oups.com...

我有一个名为s的选择在名为f的形式中：

默认情况下，页面上只显示选择中的一个选项 -
这就是我想要的。
document.fsoptions.length选项。
TIA
ddailey

I have a select named "s" in a form named "f":

By default only one of the options in the select appears on the page --
that is how I want it.

What I''d like to do is simulate a click on the select so that all of
its options become visible -- i.e., its option box opens to reveal all
document.f.s.options.length options.
TIA
ddailey

这不是你想要的，但所有选项都可见。

var theSize = document.forms [" f"]。elements [" s"]。length;

document.forms [" f"]。elements [" s"] .size = theSize;


然后将theSize更改回1并在完成后再次运行第二行。

它没有'模拟点击，但所有选项都可见。

HTH

This is not exactly what you were wanting, but all options become visible.

var theSize = document.forms["f"].elements["s"].length;
document.forms["f"].elements["s"].size = theSize;

then change theSize back to 1 and run the 2nd line again when you''re done.
it doesn''t simulate a click, but all the options become visible.
HTH

你好DDaily，

plse检查下面的代码。

希望这就是你所期待的r：

< form name =" f">

< select name =" s" onChange =" this.multiple =''true''，this.size ='''5''">

< option selected value =''''> ---汽车类型---< / option>

< option value =" ford">福特< /选项>

< option value =" chevy" ;>雪佛兰< /选项>

< option value =" honda"> Honda< / option>

< option value =" toyota"> ;丰田< /选项>

< / select>

< / form>

之前海报的代码更灵活因为它检测到选项

长度，在上面的情况下，（更具体）需要

硬编码到表单本身。 />

无论如何，我希望这会有所帮助！

-Jim

Hi There DDaily,
plse check the following code out.
Hopefully this is what you were looking for:
<form name="f">
<select name="s" onChange="this.multiple=''true'', this.size=''5''">
<option selected value=''''>--- Automobile Types --- </option>
<option value="ford">Ford</option>
<option value="chevy">Chevrolet</option>
<option value="honda">Honda</option>
<option value="toyota">Toyota</option>
</select>
</form>
The prior poster''s code is more flexible as it detects the options
length, which in the case of the above, (which is more specific) needs
to be hard-coded into the form itself.

In any event, I hope this helps!
-Jim

Hal Rosser写道：

Hal Rosser wrote:

这不是你想要的，但所有选项都可见。
var theSize = document.forms [" f"]。elements [" s"] .length;
document.forms [" f"]。elements [" s"]。size = theSize;

This is not exactly what you were wanting, but all options become
visible.
var theSize = document.forms["f"].elements["s"].length;
document.forms["f"].elements["s"].size = theSize;

使用类似的逻辑，看看我之前做过的这个概念验证：
http://www.mattkruse.com/temp/expand_select.html


它不完美而且没有在所有情况下都工作，但它很有趣。


-

Matt Kruse
http://www.JavascriptToolbox.com
http://www.AjaxToolbox.com

Using similar logic, check out this proof of concept I did a while ago:
http://www.mattkruse.com/temp/expand_select.html

It''s not perfect and doesn''t work in all cases but it''s interesting.

--
Matt Kruse
http://www.JavascriptToolbox.com
http://www.AjaxToolbox.com

这篇关于打开与选择关联的选项框的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！