Question

我有一个表单，其中一个下拉菜单生成了2个字段。现在的问题是我生成了一个字段并尝试获取两个字段，在第一个字段中显示价格，在第二个标记中显示product_id。我的脚本只显示价格而不是ID。由于缺乏知识，我被困住了。我只是需要某人的帮助。

JavaScript的：

function setOptions(chosen) {
    var selbox = document.myform.opttwo;
    selbox.options.length = 0;
    if (chosen == " ") {
        selbox.options[selbox.options.length] = new Option('Please select one of the options above first',' ');   }
        selbox.options[selbox.options.length] = new Option('100 Directory Submission', '$9.99', '1');
        selbox.options[selbox.options.length] = new Option('200 Directory Submission', '$19.99', '2');
        selbox.options[selbox.options.length] = new Option('300 Directory Submission','$29.99', '3');
    }
    document.myform.amount.value="";
    document.myform.hidden.value="";
}

HTML：

<select name="opttwo" size="1" onchange="this.form.amount.value=this.value;">
    <option value=" " selected="selected">Select any option of the above first</option>
</select>
Amount Payable:<input type="text" readonly="readonly" name="amount" />
Product id:<input type="text" name="hidden" readonly="readonly" />

Answer 1

~~首先，您的代码存在一些明显的问题，例如关闭和未关闭的大括号。~~

其中一个例子就是这一行：

if (chosen == " ") { selbox.options[selbox.options.length] = new Option('Please select one of the options above first',' '); }

<击> 编辑：这不再是这种情况。

其次，您尝试创建的Options对象不具有您尝试获取的“id”属性。

所以你的代码

selbox.options[selbox.options.length] = new Option('100 Directory Submission', '$9.99', '1');

没有将'1'作为其ID。

构造函数是

new Option([text], [value], [defaultSelected], [selected])

但是，您可以在onchange处理程序中执行此操作来获取元素的索引：

this.form.hidden.value=this.selectedIndex;

第三，如果你想继续在onchange标签中使用脚本的路径，通常不鼓励，你也必须设置隐藏输入的值。

像这样：

onchange="this.form.amount.value=this.value; this.form.hidden.value=this.value;"

注意：上面这一行会给你错误的价值，只是说，但你得到了它的要点。

我为你玩弄了一个小提琴，并看看它是如何完成的。

Here is it

我相信一些API文档总是按顺序排列：

更新：为了在每个Option上动态设置id，你必须循环选择列表中的元素，如下所示：

for (var i=0; i<selbox.length; i++){ selbox.options[i].setAttribute('id', 'hello'+i); }

然后在您在onchange()中设置的行中添加此

this.form.hidden.value=this[selectedIndex].id;

现在您的输入应该显示，当您选择一个选项时，“hello0”，“hello1”，“hello2”，“hello3”。

另外，我为你更新了小提琴。

Mozilla Option API

将id提供给文本字段

1 个答案: