Question

每次选定的下拉列表项更改时，我都会尝试更改分区中显示的值。按钮点击执行此操作是我到目前为止所做的，但是，我想知道每次选择更改时是否可以自动更改此值。

<select id="mySelect">
    <option value="st1" selected="selected">Create new Stream</option>
    <option value="st1">Stream 1</option>
    <option value="st2">Stream 2</option>
    <option value="st3">Stream 3</option>
    <option value="st4">Stream 4</option>
</select>

<input type="button" value="show attributes" class="panel-button-attr" onclick="choice()">

我的js功能：

function choice() {

    var choice=document.getElementById("mySelect");
    var strUser = choice.options[choice.selectedIndex].text;

    if(strUser=="Stream 1"){
        alert("You selected Stream 1");
    }
    else if(strUser=="Stream 2"){
        alert("You selected Stream 2");
    }
    else if(strUser=="Stream 3"){
        alert("You selected Stream 3");
    }
    else if(strUser=="Stream 4"){
        alert("You selected Stream 4");
    }
    else {
        alert("Create Stream");
    }

}

根据这段代码，我需要在不调用选项的情况下显示警告消息（每次都是0函数。相反，它应该在下拉列表中的每个选择更改时发出警告

Answer 1

首先，你可以这样做（更有活力）：

var choice  = document.getElementById("mySelect");

function choice()
{
    var strUser = choice.options[choice.selectedIndex].text;

    if(strUser !== "Create new Stream"){
        alert("Create new stream");
    }
    else{
        alert("You selected " + strUser);
    }
}

然后，你必须添加一个＆＃34; onChange＆＃34;选择的事件。

<select id="mySelect" onchange="choice()">
    <option value="st1" selected="selected">Create new Stream</option>
    <option value="st1">Stream 1</option>
    <option value="st2">Stream 2</option>
    <option value="st3">Stream 3</option>
    <option value="st4">Stream 4</option>
</select>

它根本不干净，但它会起作用。如果你想要一个更好，更正确的方法，请告诉我。

Answer 2

您可以在select：

上设置onchange事件

<select id="mySelect" onchange="choice()">
    <option value="st1" selected="selected">Create new Stream</option>
    <option value="st1">Stream 1</option>
    <option value="st2">Stream 2</option>
    <option value="st3">Stream 3</option>
    <option value="st4">Stream 4</option>
</select>

下拉列表项更改时动态显示所选项目作为警报（Javascript）

2 个答案: