如何判断JavaScript中select的change事件是用户触发还是代码触发

你输出e.isTrusted为undefined的原因是：jQuery绑定事件返回的事件对象是jQuery二次封装的对象，原生DOM事件的属性存放在e.originalEvent属性下，直接访问e.isTrusted自然拿不到对应值。

你可以选择以下任意一种方案实现需求： #

方案1：使用原生事件的isTrusted属性 #

该方案无需修改其他业务逻辑，仅调整事件回调代码即可：

• 将e.isTrusted替换为e.originalEvent.isTrusted，修改后代码如下：

$(document).on('change', 'select', function (e) {
    e.preventDefault();
    // 访问原生事件对象的isTrusted属性，true为用户触发，false为代码触发
    const isUserTrigger = e.originalEvent.isTrusted;
    console.log(isUserTrigger); 
    if (isUserTrigger) {
        save_review();
        console.log("Point status changed by user - Saved");
    } else {
        console.log("Point status changed programmatically - Not Saved");
    }
});

• 说明：isTrusted是DOM3级事件规范定义的标准属性，兼容所有现代浏览器，仅IE9及以下版本不支持。

方案2：自定义标记兼容方案（全场景适用） #

如果需要兼容旧浏览器，或者想要更可控的判断逻辑，可以通过手动加标记的方式实现：

1. 先修改定时器中修改select值的逻辑，修改取值前给对应元素添加自定义标记：

// 定时器内修改select值的示例代码
const targetSelect = $('#目标select的选择器');
// 标记当前修改为代码触发
targetSelect.data('programmatic_change', true);
// 修改select取值
targetSelect.val('你要设置的目标值');

2. 再修改change事件回调，判断自定义标记即可：

$(document).on('change', 'select', function (e) {
    e.preventDefault();
    const $this = $(this);
    const isProgrammaticChange = $this.data('programmatic_change');
    if (!isProgrammaticChange) {
        save_review();
        console.log("Point status changed by user - Saved");
    } else {
        // 用完即移除标记，避免影响后续用户操作的判断
        $this.removeData('programmatic_change');
        console.log("Point status changed programmatically - Not Saved");
    }
});

该方案完全可控，不受浏览器兼容性限制，适合所有业务场景。

内容的提问来源于stack exchange，提问作者Source Matters