javascript - 获取选择值然后添加到自定义 html 属性

Question

有没有办法让我获得客户的选择，然后将其添加到自定义 html5 属性中？

我有一个来自数据库的动态选择 mnu，它生成以下 HTML:

  <select name="options">
    <option value="2 Tier &pound;250.00">2 Tier &pound;250.00</option>
    <option value="3 Tier &pound;350.00">3 Tier &pound;350.00</option>
    <option value="4 Tier &pound;450.00">4 Tier &pound;450.00</option>
   </select>

所以基本上，如果客户选择选项一，我想获取值，去掉文本并只获取数字，而不是刷新页面或移动到其他任何地方(还没有)将此值添加到自定义属性中；我用于 jQuery 购物车。

 <div class="item" data-id="123" data-name="Some product name" data-price="VALUE_HERE">

我认为 jQuery 可以做到这一点，但不确定如何实现，因此请寻求帮助，请提供有关如何执行此操作的示例。

Answer 1

这是您正在看的东西吗？

<强> FIDDLE

 <select name="options">
    <option value="2 Tier &pound;250.00">2 Tier &pound;250.00</option>
    <option value="2 Tier &pound;250.00">3 Tier &pound;350.00</option>
    <option value="2 Tier &pound;250.00">4 Tier &pound;450.00</option>
   </select>
 <div class="item" data-id="123" data-name="Some product name" data-price="VALUE_HERE">

Javascript

$("select").change(function(){
   selectedValue = $(this).val();     
//alert(selectedValue);
var p = selectedValue.indexOf("£");
rest = selectedValue.substring(p+1);
$(".item").attr("data-price",rest)}).change();