如何用JQuery获取select的data-value填充指定ID表单字段？

原代码问题说明 #

• 事件绑定错误：下拉选框值变更应该用change事件而非keyup，keyup仅在键盘按键抬起时触发，无法覆盖鼠标点击选择选项的场景
• 属性获取逻辑错误：jQuery("data-value")是全局查找标签名为data-value的元素，完全不符合需求，需要先定位到当前select下被选中的option元素，再读取它的data-value属性值

修正后代码 #

jQuery("#shop").on("change", function(){
  // 取当前选中option的data-value值
  const selectVal = jQuery(this).find("option:selected").data("value");
  // 赋值给目标字段
  jQuery("#j2store_jformattribsj2storevendor_id").val(selectVal);
});

如果使用的是低版本jQuery，也可以把.data("value")替换为.attr("data-value")，效果一致。

内容的提问来源于stack exchange，提问作者Fatin Ishrak Rafi