如何將值傳遞給數據屬性？

Question

如何將一個data-attribute值傳遞給另一個？

我有以下輸入：

<input type="radio" class="d-none" name="varieties" value="option_0" data-price-package-value-id-0="2 625">

我需要將data-price-package-value-id-0到以下元素：

<li id="front_0" data-value="1 625">

圖片預覽

這是到目前為止的JavaScript：

// Radio buttons prise
$(document).ready(function(){
    $('input[name="varieties"]:checked').change(function() {
        var package_select = this.attr('data-price-package-value-id-0');

        var dataval = document.getElementById("0").attr('data-value');
        dataval = package_select;
    });
});

我也有一個范圍輸入，已經將值從li中提取出來了，這已經可以工作了，但是在另一個函數中，

現在我有一個任務要把無線電的價值傳遞給李

Answer 1

attr()是jQuery方法。 如果您想使用香草javascript進行此操作，則將需要使用

this.getAttribute('data-price-package-value-id-0')
this.setAttribute('data-price-package-value-id-0', newValue)

如果要使用jQuery，請使用

$(this).data('price-package-value-id-0') //getter
$(this).data('price-package-value-id-0', newValue) //setter

或者您可以使用attr()但不要將attr()和data()的使用混在一起

$(this).attr('data-price-package-value-id-0') //getter
$(this).attr('data-price-package-value-id-0', newValue) //setter

Answer 2

首先，您可能不應該使用以數字開頭的ID，因為它使得在CSS和jQuery中更難選擇，但是您可以使用：

$(document).ready(function(){
    $('input[name="varieties"]').change(function() {
        var package_select = $(this).attr('data-price-package-value-id-0');
        $(document.getElementById("0")).attr('data-value', package_select );
    });
});

Answer 3

const element = document.getElementById('front_0'); element.setAttribute('data-value', 'my spectacular new value');