JQuery Only Shows First Value

Question

I have function in my JQuery that will fill value in #product_detail with data-name=value, for first time it was success when i tried for second time, it only show first value even when i inspect elemen in data-name is second value.

Here's my HTML code:

 // here's my button that to alert function fillspan(productname) { $("#product_detail").attr("data-name", productname); } //the problem function showitems() { var name = $("#product_detail").data("name"); alert(name); } 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script> <select onchange="fillspan(this.value)"> <option value="value1">Value1</option> <option value="value2">Value2</option> </select> <span id="product_detail"></span> <button onclick="showitems()">Click</button> 

Answer 1

要获取“ #product_details”的数据名称，可以使用$("#detail_product").attr("data-name");

Answer 2

If I got your point you can use this code .. use change event instead of onchange attribute and change $("#product_detail").attr("data-name", productname); to $("#product_detail").data("name", productname);

Note: onchange="fillspan(this.value)" will work as well instead of change event but it won't give you a chance to update the data attribute onload ( I didn't tried it before so this is my personal information about it )

 $(document).ready(function(){ $('select').on('change' , function(){ var get_Value = $(this).val(); fillspan(get_Value); }).change(); // by adding .change() here this will make the change event run onload .. if no need to run it onload you can remove it }); // here's my button that to alert function fillspan(productname) { $("#product_detail").data("name", productname); } //the problem function showitems() { var name = $("#product_detail").data("name"); alert(name); } 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script> <select> <option value="value1">Value1</option> <option value="value2">Value2</option> </select> <span id="product_detail"></span> <button onclick="showitems()">Click</button>