如何使用数据集值更新输入字段？

Question

我无法弄清楚我错过了什么......我正在尝试执行之前已经完成的任务（更改 <input> 上的值 <select> 更改），但我看不到我的代码失败的地方。

然后我从一个单独的基于 woocommerce 的命令创建我的下拉菜单，在该命令中我使用 datasets 来存储值；我想在两个关联的输入中使用这些值。

echo '<p><select id="product" name="product" onchange="change_details(this.value)">';
    echo '<option>-- Select SKU--</option>';
while ( $loop->have_posts() ) : $loop->the_post();
  global $product;
    $sku = $product->get_sku();
    echo '<option value=' . $sku . ' data-sales=' . $results[$sku]['sales'] .' data-token=' .$results[$sku]['token'] . '>' . $sku . ' </option>';
  endwhile;
echo '</select>'; 

在这里我想更新两个输入字段以具有这些 sales 和 token 值：

echo '<p><input type="text" placeholder="sales" id="sales" name="sales" size="20" /></p>'; 
echo '<p><input type="text" placeholder="e.g. token" id="token" name="token" size="20" /></p>'; 

最后，我的 onchange 函数的 javascript；

function change_details(){
        document.getElementById("sales").dataset.sales;
        document.getElementById("token").dataset.token;
}

Answer 1

StackOverflow javascript sn-p builder 无法正常工作...

function change_details(obj){
  document.getElementById("sales").value = obj.options[obj.selectedIndex].dataset.sales;
  document.getElementById("token").value = obj.options[obj.selectedIndex].dataset.token;
}

<select onchange="change_details(this);">
  <option value="sku1" data-sales="sku_sales1" data-token="sku_token1">skuA</option>
  <option value="sku2" data-sales="sku_sales2" data-token="sku_token2">skuB</option>
  <option value="sku3" data-sales="sku_sales3" data-token="sku_token3">skuC</option>
  <option value="sku4" data-sales="sku_sales4" data-token="sku_token4">skuD</option>
</select>

<input type="text" placeholder="sales" id="sales" name="sales" size="20" />

<input type="text" placeholder="e.g. token" id="token" name="token" size="20" />

将选择元素对象传递给您的函数，然后使用纯 javascript 隔离所选选项，然后使用数据集值设置输入值。

https://jsfiddle.net/7b51f38t/12/

您的 javascript 函数实际上并没有“做任何事情”。