如何在onchange函数中传递数据列表的数据值？

Question

我有一个带有“值”和“数据值”的数据列表。我设法只显示一个值（奥克兰，曼谷）。可以根据需要工作。但是，我需要将“数据值”传递给选项（选择）更改时的另一个输入。我的编程技能几乎为零。我尝试将“ attr（“数据值”）“和” $（this）.data（“ id”）“添加到我的代码中，但是它不起作用。当我从数据列表更改值时，另一个输入为空或显示“未定义”。<input list="shop_ids" id="listshops" name="shop_id" onchange="this.form.f_shop_hidden.value=this.form.shop_id.value" /><datalist id="shop_ids"><option data-value="1" value="Auckland"></option><option data-value="2" value="Bangkok"></option><option data-value="3" value="Sydney"></option></datalist><!-- Text field, where data-value should be displayed --><input type="text" name="f_shop_hidden" id="f_shop_hidden"> 单击数据列表并选择Auckland后，“ f_shop_hidden”输入中将显示“ Auckland”（值）。我需要在此处显示数字“ 1”（数据值）。我整个星期都在努力破解这个坚果。非常感谢你。:)

Answer 1

您可以执行以下操作：

const select = this.form.shop_id;

const dataValue = select.options[select.selectedIndex].dataset.value;

console.log(dataValue);