从两个下拉中得到值的问题。

时间:2020-12-09 20:49:07

I'm a newbie in html/javascript languages.

我是html/javascript语言的新手。

I'm trying to get value from both combined dropdowns and show it. My problem is that I'am doing something wrong and I can't understand what.

我试着从这两个合并的下拉列表中获取价值并展示出来。我的问题是我做错了什么,我不能理解。

Note: As a plus, I want to add more dropdowns.

注意:另外,我想添加更多的下拉列表。

Follows the html:

遵循html:

    <form>
    <select name="courselevel" id="courselevel" style="width:120px">
        <option>Courses level</option>
        <option value="1">level 5</option>
        <option value="2">level 4</option>
        <option value="3">level 3</option>
        <option value="4">level 2</option>
        <option value="5">level 1</option>
    </select>
    <br/>
   <select name="tolevel" id="tolevel" style="width:120px">
        <option>To level</option>
        <option value="1">level 4</option>
        <option value="2">level 3</option>
        <option value="3">level 2</option>
        <option value="4">level 1</option>
    </select>
    <br/>
    <input name="button" type="button" value="Submit" onclick="return validate()" />   
    <input name="reset" type="reset" value="Reset" />
<div id="total"></div>
</form>

Follows my js:

遵循我的js:

var courselevel = document.getElementById('courselevel'),
    tolevel = document.getElementById('tolevel');

    window.onload = function(){
courselevel = document.getElementById('courselevel'),
tolevel = document.getElementById('tolevel');

courselevel.addEventListener('change', function(e) {
    switch (level.selectedIndex) {
        case 0:
            var courselevelList1   = ["Select level"];
            var courselevellist2    = ["Select level2"];
            fillList(courselevel, courselevelList1);
            fillList(tolevel, courselevelList2);
            break;

        case 1:

            var courselevelList   = ["Select level", "5", "4", "3", "2", "1"];
            var courselevelList2    = ["Select level2", "4", "3", "2", "1" ];
            fillList(level, courselevelList1);
            fillList(tolevel, courselevelList2);
            break;

    }
});

};




function fillList(el, items) {
     el.innerHTML = '';
    for (var i = 0; i < items.length; i++) {
        var option = document.createElement('option');
        option.value = items[i];
        option.text = items[i];
        el.add(option);
    }
}


window.validate = function() {
    var courselevelvalue = parseFloat(courselevel.options[courselevel.selectedIndex].value),
        tolevelvalue = parseInt(tolevel.options[tolevel.selectedIndex].value),
        totaltolevelvalue = courselevelvalue + tolevelvalue;

    total.innerHTML = totaltolevelvalue;    
    return totaltolevelvalue;        

1 个解决方案

#1


1  

I can't see a clear question but in this fiddle that I made with your code you can see that the problem is that total is not defined

我看不出一个清晰的问题但是在我用你的代码做的这个小提琴里你可以看到问题是total没有定义

you have this:

你有这个:

total.innerHTML = totaltolevelvalue; 

but there is no declaration for total

但是没有对total的声明

perhaps you have not included your code in its entirety

也许您没有完整地包含您的代码

#1


1  

I can't see a clear question but in this fiddle that I made with your code you can see that the problem is that total is not defined

我看不出一个清晰的问题但是在我用你的代码做的这个小提琴里你可以看到问题是total没有定义

you have this:

你有这个:

total.innerHTML = totaltolevelvalue; 

but there is no declaration for total

但是没有对total的声明

perhaps you have not included your code in its entirety

也许您没有完整地包含您的代码