Javascript错误：应为对象（使用SelectedIndex属性）

我似乎想不出一个办法来解决这个模糊的“预期对象”错误。我正在创建一个页面，用户在其中填写表格以参加音乐会。错误出现在我的函数“totalBill”中，它与“city”和“dates”对象有关

• 错误发生在

  j=dates.selectedIndex和
  k=city.selectedIndex

• 我将包括一些我认为与错误有关的代码片段

这是功能的一部分：

<script language="JavaScript" type="text/javascript">
    var city2=" ";
    var date2=" ";
    function totalBill() {
        with (document.coldplay) {
            var j;
            var k;

            j = dates.selectedIndex;
            k = city.selectedIndex;

            if (dates.options[j].value == "1") {
                date2 = " Friday, June 5th";
            }
            if (dates.options[j].value == "2") {
                date2 = " Saturday, June 6th";
            }

            if (city.options[k].value == "Chicago") {
                city2 = " Chicago";
            }
            if (city.options[k].value == "Austin") {
                city2 = "Austin";
            }

var city2=“”；
var date2=“”；
函数totalBill（）{
使用（document.coldplay）{
var j；
var-k；
j=日期。选择的索引；
k=城市。选择的索引；
如果（日期.选项[j].值==“1”）{
date2=“6月5日，星期五”；
}
如果（日期.选项[j].值==“2”）{
date2=“6月6日，星期六”；
}
if（city.options[k].value==“芝加哥”）{
city2=“芝加哥”；
}
if（city.options[k].value==“Austin”）{
city2=“奥斯汀”；
}

在body（form）部分，用户选择城市和日期

    <select name="city">
        City:
        <option value= "Chicago"> Chicago, Illinois 
        <option value= "Austin"> Austin, Texas 
        <option value= "Miami"> Miami, Florida  
    </select><br>
</td>
<td>
    <select name="dates">
        Date:
        <option value= "1"> Friday, June 5th 
        <option value= "2"> Saturday, June 6th
        <option value= "3"> Friday, June 12th  
        <option value= "4"> Saturday, June 13th
        <option value= "5"> Friday, June 19th 
        <option value= "6"> Saturday, June 20th
        <option value= "7"> Friday, June 26th  
        <option value= "8"> Saturday, June 27th
    </select>

城市：
伊利诺伊州芝加哥
德克萨斯州奥斯汀
佛罗里达州迈阿密


日期：
6月5日，星期五
6月6日，星期六
6月12日，星期五
6月13日，星期六
6月19日，星期五
6月20日，星期六
6月26日，星期五
6月27日，星期六

通过

document.getElementById（“日期”）

然后得到它的性质：

document.getElementById（“日期”）。选择索引

请注意，您必须添加
id
属性，或者以其他方式（通过名称等）获取元素

编辑

这里需要的是获取元素，然后访问其属性。如果只添加“dates”的id（而不是名称），这也会起作用——不过我建议使用getElementById（）[或jQuery等效项]以提高可读性。
以下是纯JavaScript的开始代码：


var city2=“”；
var date2=“”；
函数totalBill（）{
var date=document.getElementById（“日期”）；
var date2=date.options[date.selectedIndex].text；
var city=document.getElementById（“城市”）；
var city2=city.options[city.selectedIndex].value；
警报（“城市：+city2+”\n日期：+date2）；
}
函数addListener（）{
document.getElementById（“提交”）.addEventListener（“单击”，totalBill）；
}

城市：
伊利诺伊州芝加哥
德克萨斯州奥斯汀
佛罗里达州迈阿密


日期：
6月5日，星期五
6月6日，星期六
6月12日，星期五
6月13日，星期六
6月19日，星期五
6月20日，星期六
6月26日，星期五
6月27日，星期六


算计

@BIU如果OP的代码在一个名为coldplay的表单中，那么它应该可以工作。请参阅jsfiddle.net/mn8vzbv2/2。但是，即使它可以工作，我仍然建议不要使用。使用ID不是一个很好的解决方案，因为听起来页面上可能会有多个下拉列表。如果您想使用ID，ID通常是一个糟糕的解决方案我们的代码是可重用的–Juan Mendes

这是正确的！谢谢你，Juan，解决了这个问题。结果是我拼错了表单名称！一个小的语法错误可能会导致一些问题，嗯！再次感谢。
是否定义了“日期”呢？你没有在函数中定义它。很好。我应该如何定义这些对象？请原谅我的错误ignorance@BIU
日期
为依赖于上面带有

的

。它可以替换为
document.coldplay
。请注意，大多数JS开发人员都远离带有

的

，除非您真的知道自己在做什么。@表单中带有名称的BIU元素会自动成为表单的属性。这是假设有一个带有
名称的表单元素=“酷玩"
@BIU如果OP的代码在一个名为coldplay的表单中，那么它应该可以工作。但是，即使它可以工作，我仍然建议不要使用
，
。使用ID不是一个很好的解决方案，因为听起来页面上可能有多个下拉列表。如果你想让代码重用，ID通常是一个糟糕的解决方案我会试试的。感谢您的快速响应，这就是我为什么写“注意，您必须添加id属性或以其他方式获取元素”@JuanMendes你是对的，我接受了他的代码，没有用
coldplay
的形式包装，它只使用id，而不是名称。OP没有在代码中包含这一点。我的观点是，他需要获取元素才能访问属性。无论采用哪种方式-以正确的形式包装它，以id显式获取它，等等-关键是他得到错误是因为JS@BIU是的，我们需要OP提供更多信息来确定问题……答案应该解释OP代码的问题所在，而不是完全使用不同的解决方案而不解释HTML，尽管无效不会导致错误问题，所以您的解释是无效的，并且没有显示出对OP问题的理解，只是BIU See建议的使用ID的解决方法