jquery 无法通过单击从元素中获取数据

e7arh2l6  于 2023-08-04  发布在  jQuery
关注(0)|答案(1)|浏览(123)

各位,我有一件事有点纠结。我在JavaScript和JQuery中有这样的代码。而下面那些有click的部分,我只是不能从clicked元素中获取data-num属性。我已经尝试了100种方法来做这件事,但它总是未定义的(但如果我通过开发人员工具检查元素,这个'data-num'真的存在),或粉碎或不工作。

let tumbArr = [];
for (x = 0; x < imgARR.length; x++) {
    let thumb = document.createElement('button');
    $(thumb).css('background-image', 'url(' + images[x].src +')');
    elements.append(thumb);
    $(thumb).attr('id', 'thumb' + x)
    $(thumb).attr('data-num', x);
    tumbArr[x] = $(thumb);
    $(thumb).attr('class', 'thumbs');    
}
$('#thumbCase').append(elements);

// this part bellow
$('.thumbs').click(()  =>  {
    s = $(this).attr('data-num');
    imgSet(s);
})

字符串
当我在做一个toDO应用程序的时候,一切都是这样工作的...

addButton.click(() => {
    clickCount++;
    let newLI = document.createElement('li');
    newLI.textContent = addIN.value;
    elements.append(newLI);
    ul.append(elements);
    $(newLI).addClass('donePlan');
    $(newLI).attr('id','plan' + clickCount );
   
    del = document.createElement('button');
    $(del).addClass('delbutton');
    $(del).html('<img src="./delete_ic_icon.png">');
    newLI.append(del);
    $(del).attr('data-plan', '#plan' + clickCount)
   ** let planID = $(this.del).attr('data-plan');
    
   
    $(del).click (()=> {
        $(planID).remove();**
    })
   
})


请帮帮我,谢谢
我试着让.thumbs类像变量一样,选择按钮exeptionaly,我从这个按钮循环tumbArr[x] = $(thumb)中做了一个数组,但它只是不像我想要的那样工作,就像我认为它逻辑上应该工作一样。

vs3odd8k

vs3odd8k1#

  • 使用箭头函数时,this的工作方式有所不同。箭头函数中的this是外部作用域的this。所以你应该在箭头函数中使用Event::currentTarget而不是this,或者使用普通的function(){}
  • 看起来你试图将click事件委托给父容器.thumbs。在本例中,this将是容器的DOM元素,处理程序将对所有点击做出React,而您只需要点击按钮。您应该使用特殊的委托函数签名,以便this指向单击的按钮。

所以箭头功能选项:

$('.thumbs').on('click', 'button', event => {
    s = $(event.currentTarget).attr('data-num');
    imgSet(s);
})

字符串
功能选项:

$('.thumbs').on('click', 'button', function() {
    s = $(this).attr('data-num');
    imgSet(s);
})

相关问题