从 html select 执行 Javascript 函数答案

【问题标题】：Execute Javascript function from html select从 html select 执行 Javascript 函数
【发布时间】：2012-03-04 08:48:44
【问题描述】：

我有一个简单的 html 选择标签，附有一些选项：

<select>
<option>school a</option>
<option>school b</option>
<option>school c</option>
</select>

我想将一些简单的事件处理程序附加到选项中，就像我想说的那样......一个链接：

<option onclick="scheduleA();">school a</option>

我是否需要构建一个单独的 Javascript 函数来处理这种情况下的事件处理，或者是否有一些快速的 html 可以完成这项任务？

【问题讨论】：

看看onchange。你可以写一个带参数的函数。
你去我的朋友*.com/questions/2000656/…
谢谢亚历克斯，我在发帖之前没有看到这个。

标签： javascript html dom-events

【解决方案1】：

这很容易做到：

<span class="text-left" hidden>{{ fullNameExists(concern.user) }}</span>

它将调用它。您甚至可以通过隐藏的阻止结果对用户可见来隐藏它。

<client-only>
<span class="text-left" hidden>{{ fullNameExists(concern.user) }}</span>
</client-only>

【讨论】：

【解决方案2】：

改用 onchange

<select onchange="schedule(this.value)">
<option>school a</option>
<option>school b</option>
</select>

function schedule(selectedValue){
     ... do something with selectedValue
}

【讨论】：

也许吧，除非我加载页面时没有答案...版主可以随意删除或其他任何内容。我来这里的时间不长，但我确实觉得社区有一种我不喜欢的态度——几乎不鼓励

【解决方案3】：

在select 上使用onchange 事件

<select onchange="scheduleA.call(this, event)">

然后在你的处理程序中......

function scheduleA(event) {
    alert(this.options[this.selectedIndex].text);
}

演示： http://jsfiddle.net/hYY6X/

【讨论】：

【解决方案4】：

您最好在<select> 上分配onChange="schedule(this.value);。部分是因为它确实有效，部分是为了避免在两次选择相同选项时出现冗余代码，部分是因为更少的事件处理程序总是更好。

【讨论】：

@kjarsenal：如果您支持旧版本的 IE，请确保为每个 option 元素赋予其自己的 value 属性。当你不给它一个值属性时，旧的 IE 不会自动替换 option 的文本内容。
注意到了。这些值将由框架动态生成。谢谢。