Question

我有一个html下拉列表，其中包含“Hello”和“Goodbye”项。

我想要做的是根据用户从下拉列表中选择的内容调用javascript函数，将根据所选值调用不同的函数。我还想将下拉列表项的值传递给onchange事件函数参数。

我已经声明了这样的html控件：

<select name="hellobye" id="hellobye" class="pulldown" onchange="sayHello or SayGoodbye(*PULLDOWN SELECTED ITEM TEXT HERE*);"></select>

我的javascript函数是：

function sayHello(msg)
{
    alert(msg);
}

function sayGoodbye(msg)
{
    alert(msg);
}

请给我一些建议。谢谢。

Answer 1

尝试在onchange中使用this.value。

Answer 2

尝试这样的事情：

function sayHello(msg)
{
    alert(msg);
}

function sayGoodbye(msg)
{
    alert(msg);
}

function say()
{
 var pulldown = document.getElementById("hellobye");
 var selectedValue = pulldown.options[pulldown.selectedIndex].value;

 if(selectedValue == helloMsgValue)
 {
  sayHelo(msg);
 }
 else
 {
   sayGoodbye(msg)
 }
}

<select name="hellobye" id="hellobye" class="pulldown" onchange="say();"></select>

Answer 3

如果您要将消息传递给函数，那么为什么不只有一个函数say：

function say(msg)
{
    alert(msg);
}

然后HTML中的JavaScript就像这样：

<select name="hellobye" id="hellobye" class="pulldown" onchange="say(this.value == 'hello' ? 'Hello there' : 'Goodbye to you');">
  <option value="hello">hello</option>
  <option value="goodbye">goodbye</option>
</select>

使用三元运算符决定发送hello或goodbye消息。

statement to test ? execute if true : execute if false

增加：

如果您需要保留单独的功能，那么这应该可行

<select name="hellobye" id="hellobye" class="pulldown" onchange="this.value == 'hello' ? sayHello('Hello there') : sayGoodbye('Goodbye to you') ;">
  <option value="hello">hello</option>
  <option value="goodbye">goodbye</option>
</select>

Answer 4

使用this.value，您可以捕获选择值并将其用于单个函数中，可能还有switch()语句：

function sayAnything(){
  switch(this.value){
    case 'goodbye': alert('I said goodbye!');
    case 'hello' : alert('I said hello!');
    default: alert('Im not sure what I said!');
  }
}

如果您有一个有限且可管理的选择选项列表，那么这将很有效，如果不这样做，那么在呈现选择而不是每个元素时，您可能会看起来分配功能，例如：

<select id="list">
  <options*many value="..." />
</select>

Y.one('#list').children().on('click', function(){
  sayAnything(this.value);
});

你必须在某处对selectedIndex进行测试，但一般的想法是使sayAnything（）调用成为常见的，并且所选选项的值将通过该常用方法调用。< / p>

使用不同的参数在HTML事件中调用不同的Javascript函数

4 个答案: