獲取選擇值，然后添加到自定義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>

因此，基本上，如果客戶選擇一個選項，我想從文本中獲取值剝離並獲取數字，而不刷新頁面或將其移動到其他任何地方（只是）將此值添加到自定義屬性I中； jQuery購物車。

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

我認為jQuery可以做到這一點，但不確定如何尋求幫助，請提供有關如何執行此操作的示例。

Answer 1

這是您正在看的東西嗎？

小提琴

 <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();

Answer 2

干得好：

<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
    $("select[name=options]").change(function() {
        var element = $(this).attr("rel");
        var tmp = $(this).val().match(/[-+]?[0-9]*\.?[0-9]+/g);
        var value = tmp[tmp.length-1];

        $('#'+element).attr('data-price',value);
    })
});
</script>
</head>
<body>
<select name="options" rel="item-1">
    <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>

<div class="item" id="item-1" data-name="Some product name" data-price="" />
</body>
</html>

獲取選擇值，然后添加到自定義html屬性

問題描述

2 個解決方案

解決方案1
1 已采納 2014-05-03 09:41:22

解決方案2
0 2014-05-03 09:40:51

獲取選擇值，然后添加到自定義html屬性

問題描述

2 個解決方案

解決方案1 1 已采納 2014-05-03 09:41:22

解決方案2 0 2014-05-03 09:40:51

解決方案1
1 已采納 2014-05-03 09:41:22

解決方案2
0 2014-05-03 09:40:51