有代码
$(document).on('click', '.checkcorpus', function() {
let dateId = $(this).data('id');
let corpusId = $(this).data('corpus-id');
let parent = $(this).parent();
let main = parent.parent().parent();
main.find('.corpus-block-date').css('box-shadow', '');
main.attr('data-id', dateId).attr('data-corpus-id', corpusId);
parent.css('box-shadow', 'inset 0 0 10px green');
check = $('.checker');
check.each(function(index, value) {
let checkId = $(value).data('id');
console.log(checkId);
});
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<td style="width:15%; max-width: 20%">
<div id="accordion-faq" class="accordion md-accordion checker" role="tablist" aria-multiselectable="true" data-id="121" data-corpus-id="1">
<div data-key="116">
<div class="corpus-block-date" style="border-bottom: 1px solid grey; padding: 10px 0px; margin-top: 5px; cursor: pointer; box-sizing: border-box;">
<div class="row padding-y-5 corpus-block-border checkcorpus" id="dateExpert-116" data-id="116" data-corpus-id="1">
<div class="col-md-12 text-center check" style="color: orangered;">
2020-09-06 </div>
</div>
</div>
</div>
<div data-key="118">
<div class="corpus-block-date" style="border-bottom: 1px solid grey; padding: 10px 0 10px; margin-top: 5px; cursor: pointer; box-sizing: border-box;">
<div class="row padding-y-5 corpus-block-border checkcorpus" id="dateExpert-118" data-id="118" data-corpus-id="1">
<div class="col-md-12 text-center check" style="color: orangered;">
2020-09-14 </div>
</div>
</div>
</div>
<div data-key="119">
<div class="corpus-block-date" style="border-bottom: 1px solid grey; padding: 10px 0 10px; margin-top: 5px; cursor: pointer; box-sizing: border-box;">
<div class="row padding-y-5 corpus-block-border checkcorpus" id="dateExpert-119" data-id="119" data-corpus-id="1">
<div class="col-md-12 text-center check" style="color: orangered;">
2020-09-12 </div>
</div>
</div>
</div>
<div data-key="121">
<div class="corpus-block-date" style="border-bottom: 1px solid grey; padding: 10px 0px; margin-top: 5px; cursor: pointer; box-sizing: border-box; box-shadow: green 0px 0px 10px inset;">
<div class="row padding-y-5 corpus-block-border checkcorpus" id="dateExpert-121" data-id="121" data-corpus-id="1">
<div class="col-md-12 text-center check" style="color: orangered;">
2020-09-08 </div>
</div>
</div>
</div>
<div data-key="122">
<div class="corpus-block-date" style="border-bottom: 1px solid grey; padding: 10px 0 10px; margin-top: 5px; cursor: pointer; box-sizing: border-box;">
<div class="row padding-y-5 corpus-block-border checkcorpus" id="dateExpert-122" data-id="122" data-corpus-id="1">
<div class="col-md-12 text-center check" style="color: orangered;">
2020-09-10 </div>
</div>
</div>
</div>
</div>
</td>
我有一个check
包含两个元素的对象
就在循环上方,当您单击某个循环时,该代码会div
更改data-id
这些元素。我不明白为什么checkId
只有第一次点击时收到的值才能进入它。为什么,尽管元素的 data-id 值发生了变化,console.log(checkId);
但它始终显示第一次单击时的值。
在这里阅读它是什么以及它是
.data()
如何工作的 -链接在您的代码中,我已替换
.data('*name*')
为.attr('data-*name*')
有点离题,但设计
el.attr('key', val).attr('key2', val2)
可以,甚至需要被替换el.attr({'key': val, 'key2', val2});