未从下拉列表传递正确的值来触发javascript函数

问题描述 投票:0回答:1

我有一个下拉列表,其中包含值“ 3周视图”,“六周视图”,“十二周视图”。然后,此下拉列表用于基于所选值触发javascript函数。我遇到的问题是,无论选择什么下拉项,它都只会传递“三”的值。这可能是显而易见的,我之前从未做过。

HTML
<center>View:</center>
                <select class="form-control" id="myList" onchange="funSelectView(this.value)">
                    <option value="none" id="df">Please Select</option>
                    <option value="three" id="thw">3 Week</option>
                    <option value="six" id="sw">6 week</option>
                    <option value="twelve" id="tww">12 Week</option>
                </select>
Javascript
function funSelectView() {
        document.getElementById("myList").onchange = function () {
            var sheet = document.getElementById("myList").value;
            if (sheet === "three") {
                alert(value);
                funThreeWeekView();
            }
            if (sheet === "six") {
                alert(value);
                funSixWeekView();
            }
            if (sheet === "twelve") {
                alert(value);
                funTwelveWeekView();
            }
            if (sheet === "none") {
                hideAll();
            }
        }
    }
javascript html asp.net core
1个回答
0
投票

在这种情况下,我通常首选以下两种方法。您也曾经使用过,但是您混合了他们。我在下面显示。第一:

HTML

<center>View:</center>
<select class="form-control" id="myList" onchange="funSelectView(this.value)">
    <option value="none" id="df">Please Select</option>
    <option value="three" id="thw">3 Week</option>
    <option value="six" id="sw">6 week</option>
    <option value="twelve" id="tww">12 Week</option>
</select>

Javascript

function funSelectView(value){
    if (value === "three") {
        alert(value);
        // funThreeWeekView(); // I don't know about it method
    }
    if (value === "six") {
        alert(value);
        // funSixWeekView();
    }
    if (value === "twelve") {
        alert(value);
        // funTwelveWeekView();
    }
    if (value === "none") {
        hideAll();
    }
}

第二:

HTML

<center>View:</center>
<select class="form-control" id="myList">
    <option value="none" id="df">Please Select</option>
    <option value="three" id="thw">3 Week</option>
    <option value="six" id="sw">6 week</option>
    <option value="twelve" id="tww">12 Week</option>
</select>

Javascript:

document.getElementById("myList").onchange = function () {
    var sheet = document.getElementById("myList").value;
    if (sheet === "three") {
        alert(sheet);
        funThreeWeekView();
    }
    if (sheet === "six") {
        alert(sheet);
        funSixWeekView();
    }
    if (sheet === "twelve") {
        alert(sheet);
        funTwelveWeekView();
    }
    if (sheet === "none") {
        hideAll();
    }
}
© www.soinside.com 2019 - 2024. All rights reserved.