从函数中获取数据属性

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

自从使用 jQuery 使用数据-api:

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

请记住 id 应以字母开头。

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

Answer 2

如果您使用 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">

Answer 3

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

从函数中获取数据属性

get data-attribute from function

javascript

jquery

flatpickr