Question

我正在尝试在<select>标签内添加简单值。我该怎么办？

下面我准备了一个示例，它看起来应该是什么样子。

<script>
$(document).ready(function(){

  $("#selectList").add("data-size='12'");

});
</script>

<select class='selectpicker' data-hide-disabled='true' id='selectList'>
</select>


// expected result
<select class='selectpicker' data-hide-disabled='true' id='selectList' data-size='12'>
</select>

Answer 1

使用香草Javascript非常简单：

document.addEventListener('DOMContentLoaded', () => {
  selectList.dataset.size='12';
  console.log(selectList);
})

<select class="selectpicker" data-hide-disabled="true" id="selectList"></select>

您也可以改用selectList.setAttribute('data-size', '12')。

在jQuery中：

$(document).ready(function() {
  $('#selectList').attr('data-size', '12');
  console.log(selectList);
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select class="selectpicker" data-hide-disabled="true" id="selectList"></select>

Answer 2

只需，您可以通过prop

添加

$("#selectList").prop('data-size', '12');

如何使用JQuery在select元素上设置数据属性

2 个答案: