JQuery中点击label需两次才触发正确功能的问题求助

可能原因 #

• 事件绑定失效：如果Bottone('B1001')函数会动态修改或重新渲染包含label的DOM区域，直接绑定的点击事件会在DOM更新后失效，后续点击需要重新触发绑定逻辑。
• sessionStorage状态残留：第二次点击时，sessionStorage中存储的旧值可能干扰业务逻辑，导致异常。
• 异步函数滥用：点击事件标记为async但未使用await，可能导致代码执行顺序混乱。

解决方案 #

1. 改用事件委托绑定 #

针对动态DOM场景，用事件委托确保新生成的label也能触发点击事件：

$(document).on('click', '.labeldata', function(e){
    sessionStorage.scambio = e.target.innerText;
    sessionStorage.crx = 11111;
    Bottone('B1001');
});

2. 检查Bottone函数的DOM操作 #

确认Bottone('B1001')执行后，label元素的labeldata类名未丢失，且DOM结构未被意外替换。若必须替换DOM，优先使用事件委托避免重复绑定。

3. 清理sessionStorage旧值 #

如果异常由旧状态残留导致，点击时先清除相关存储项：

$('.labeldata').click(function(e){
    sessionStorage.removeItem('scambio');
    sessionStorage.removeItem('crx');
    
    sessionStorage.scambio = e.target.innerText;
    sessionStorage.crx = 11111;
    Bottone('B1001');
});

4. 移除不必要的异步标记 #

若Bottone不是异步函数，删除async关键字，避免异步队列影响执行顺序：

$('.labeldata').click(function(e){
    sessionStorage.scambio = e.target.innerText;
    sessionStorage.crx = 11111;
    Bottone('B1001');
});

5. 阻止事件冒泡 #

如果存在父元素事件冲突，添加事件阻止冒泡：

$('.labeldata').click(function(e){
    e.stopPropagation();
    sessionStorage.scambio = e.target.innerText;
    sessionStorage.crx = 11111;
    Bottone('B1001');
});

内容的提问来源于stack exchange，提问作者Nicola Pane