Question

我正在尝试从我的函数中获取data-io属性。

<input id="42297" class="edit flatpickr-input active" data-io="in" value="14:23" type="text" readonly="readonly">

onChange: function(selectedDates, time, instance){

使用此代码，我可以输入我的输入ID：instance.input.id
但我无法弄清楚如何访问data-io属性。

我试过了：

instance.input.data-io
instance.input.data('io')
instance.input.attr('data-io')
instance.input.attr('io')

我该怎么办？

Answer 1

使用instance.input.dataset.io。有关data- *属性的更多信息，请访问： https://developer.mozilla.org/en-US/docs/Learn/HTML/Howto/Use_data_attributes

Answer 2

由于使用jQuery使用data-api：

$('#42297').data('io'); // -> in

请注意，id应以字母开头。

如果您的instance.input是JS对象，请将其转换为jQuery：$(instance.input).data('io')

Answer 3

如果您使用的是jquery，请使用.data('io')或attr('data-io')。如果使用vanilla js，请使用Element.getAttribute()。

var inp = document.getElementById('42297');
console.log(inp.getAttribute('data-io'));
var $inp = $('#42297');
console.log($inp.data('io'));
console.log($inp.attr('data-io'));

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input id="42297" class="edit flatpickr-input active" data-io="in" value="14:23" type="text" readonly="readonly">

从函数中获取数据属性

3 个答案: