Question

当然，这不应该这么难吗？

我有<select>，当然有<options>。这些options在数字格式中始终，因为它们会被用户动态添加到列表中。

然后我需要从列表中获取所有这些选项，将它们放入一个数组，然后在数组上执行逻辑。我试过四处寻找，但一切都与jquery或php有关 - 我使用普通的旧HTML和JavaScript。

select采用滚动框格式：

<select id="selectBox" name="select" size="15" style="width:190px;">  
<!-- <options> are added via javascript -->     
</select>

目前，我正在使用此JavaScript来获取元素，但它不起作用：

//Calculate all numbers
        var x=[];
    function calculate()
    {
        for (var i = 0; i < 999; i++)
        {
            x[i]=selectbox.options[i].value;
            alert(x[i]);
        }

    }

Calculate()由按钮调用。有些事情非常糟糕，我无法解决这个问题。 selectbox以前定义为var selectbox = document.getElementById("selectBox");，我知道这有效。

警报只被调用，所以我可以尝试调试这个东西......

我正在使用999的数字，因为我无法弄清楚如何获得<select>中有多少元素（因为它采用滚动框格式）。解决方案必须 javascript ，列表框必须采用滚动框格式。

提前感谢您的帮助！

编辑 - 好的，更多编码可以帮助您。

<form id="aggregateForm">
    <input id="inputNum" value="" type="text"><input id="addnum" value="Add" onclick="add();" type="button">
    <br>
    <select id="selectBox" name="select" size="15" style="width:190px;">  

    </select>
    <br>
    <input id="calculate" value="Calculate" onclick="calculate();" type="button"><input id="reset" value="Reset" onclick="reset();" type="button">
</form>

<script type="text/javascript">
    var selectbox = document.getElementById("selectBox");

    function add()
    {
    //Function to add a new number to the list of digits
    //Parses an integer to ensure everything works okay
    if(IsNumeric(document.getElementById("inputNum").value) == true)
    {
        selectbox.options[selectbox.options.length] = new Option(document.getElementById("inputNum").value, document.getElementById("inputNum").value);
        inputNum.focus();
    }
    else if(IsNumeric(document.getElementById("inputNum").value) == false)
    {
        alert("I'm sorry, but you have entered an invalid number. Please enter a number into the input box.");
        inputNum.focus();
    }
    }

    //Calculate all numbers
    var x=[];
    function calculate()
    {
    for (var i = 0; i <selectbox.options.length; i++)
        {
    x[i]=selectbox.options[i].value;
    alert(x[i]);
        }


    }

    //IsNumeric function coding taken from http://stackoverflow.com/questions/18082/validate-numbers-in-javascript-isnumeric, code by Joel Coehoorn
    function IsNumeric(input)
    {
        return (input - 0) == input && input.length > 0;
    }


</script>

Answer 1

检查此jsfiddle

var selectbox = document.getElementById("selectBox");

var x = [];

function calculate()
{
    for (var i = 0; i <selectbox.options.length; i++)
    {
        x[i]=selectbox.options[i].value;
        alert(x[i]);
    }

}
calculate();

这将提示选择中的每个选项元素。

Answer 2

问题是calculate也是元素的ID。奇怪的是，它认为计算的是DOM对象而不是你的功能：proof。我将函数名称更改为calculates。

我上周才发现你可以用带有所述ID的ID来引用你的元素。

<div id="really">Yep for some reason</div>

...稍后在javascript中

// no document.getElementById, just
// let me be very clear, THIS IS WRONG TO USE VERY BAD SO EVERYONE CAN KNOW NOT TO USE THIS
// but it does work this way so be aware
really.innerHTML = "I guess he was right.";

从<select>中提取值并将它们放入数组</select>

2 个答案: