Question

我想了解JS的基础知识。为什么以下脚本始终产生相同的答案。为什么用户选择没有传递给函数？请仅使用普通的JS给出答案。

<script>
    document.writeln('First person:');
</script>

<select id="monthSelect1">
    <option value="1">January</option>
    <option value="2">February</option>
    <option value="3">March</option>
    <option value="4">April</option>
    <option value="5">May</option>
    <option value="6">June</option>
    <option value="7">July</option>
    <option value="8">August</option>
    <option value="9">September</option>
    <option value="10">October</option>
    <option value="11">November</option>
    <option value="12">December</option>
</select>

<select id="daySelect1">
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
    <option value="4">4</option>
    <option value="5">5</option>
</select>

<br />

<script>
    document.writeln('Second person:');
</script>

<select id="monthSelect2">
    <option value="1">January</option>
    <option value="2">February</option>
    <option value="3">March</option>
    <option value="4">April</option>
    <option value="5">May</option>
    <option value="6">June</option>
    <option value="7">July</option>
    <option value="8">August</option>
    <option value="9">September</option>
    <option value="10">October</option>
    <option value="11">November</option>
    <option value="12">December</option>
</select>

<select id="daySelect2">
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
    <option value="4">4</option>
    <option value="5">5</option>
</select>

<br />

<input type="button" value="Calculate!" onclick=showResult()>

<script>

    var e = document.getElementById('monthSelect1');
    var i = e.selectedIndex;
    var sMonth1 = e.options[i].value;

    var e = document.getElementById('daySelect1');
    var i = e.selectedIndex;
    var sDay1 = e.options[i].value;

    var e = document.getElementById('monthSelect2');
    var i = e.selectedIndex;
    var sMonth2 = e.options[i].value;

    var e = document.getElementById('daySelect2');
    var i = e.selectedIndex;
    var sDay2 = e.options[i].value;

    function showResult()
    {
        alert('First person: ' + sMonth1 + '/' +  sDay1 + 
        ' Second person: ' + sMonth2 + '/' + sDay2);
    }

Answer 1

您需要计算showResult函数内的值。该脚本在页面加载时运行，并且所有值都被提取并存储在变量中。

在showrresult函数中，您只是调用包含过去值的变量。这就是为什么总会显示相同结果的原因。

另请注意，您一次又一次地重新声明相同的变量e and i。相反，只有第一个语句必须包含var，而其他语句可以避免它。

function showResult()
{
    var e = document.getElementById('monthSelect1');
    var i = e.selectedIndex;
    var sMonth1 = e.options[i].value;

    e = document.getElementById('daySelect1');
    i = e.selectedIndex;
    var sDay1 = e.options[i].value;

    e = document.getElementById('monthSelect2');
    i = e.selectedIndex;
    var sMonth2 = e.options[i].value;

    e = document.getElementById('daySelect2');
    i = e.selectedIndex;
    var sDay2 = e.options[i].value;
    alert('First person: ' + sMonth1 + '/' +  sDay1 + 
    ' Second person: ' + sMonth2 + '/' + sDay2);
}

Answer 2

因为你过早计算了。

这是怎么回事：

你写＆＃34;第一个人＆＃34; （以及它为什么document.write而不是正常的标签，一个谜）
您创建了下拉列表
你写＆＃34;第二人＆＃34;
您创建了下拉列表
您获取下拉值并计算结果
单击按钮时，显示计算结果

计算需要在函数内部，以便在每次单击按钮时重新计算它。

Answer 3

@maxval你遇到的问题是因为你在函数外部声明了变量。因此在函数内部，变量的值将是未定义。因此控件永远不会到达你的声明部分。正确的代码应该是

<div>
    <select id="ddl1">
    <option value="a">a</option>
    <option value="b">b</option>
    </select>
    <input type="button" value="click" onclick="getdata();" />
</div>

<script type="text/javascript">
    function getdata()
    {
    var obj=document.getElementById('ddl1');
    var val=obj.value;
    alert('value:'+val);
    }
    </script>

您可以使用 Mozilla Firefox添加on-firebug 轻松调试您的javascript，或者如果您使用 IDE ，例如 Visual studio ，您可以调试javascript使用 Internet Explorer

为什么不传递价值？

3 个答案: