点击事件中jQuery同时选中event.target与指定元素报错求助

错误原因 #

你这里的核心问题是**event.target是DOM元素对象，不是字符串选择器**。直接和字符串,#element2拼接时，JavaScript会自动调用DOM元素的toString()方法，将其转换为[object HTMLButtonElement]，最终生成的选择器字符串[object HTMLButtonElement],#element2不符合jQuery选择器的语法规范，因此抛出了语法错误。

正确写法 #

推荐两种常用的解决方式：

方式1：使用jQuery的add()方法合并元素 #

先将event.target转换为jQuery对象，再通过add()方法添加另一个选择器对应的元素，即可同时操作两个目标元素：

$(event.target).add("#element2").closest("div").removeClass("alert-info").addClass("alert-success");

方式2：将DOM元素转为合法选择器字符串（局限性较大） #

如果一定要用字符串拼接的方式，需要把event.target转换成合法的选择器字符串（比如利用元素的ID、类名等唯一标识），但这种方式仅适用于元素有明确唯一标识的场景：

// 示例：假设event.target有唯一ID属性
$("#" + event.target.id + ",#element2").closest("div").removeClass("alert-info").addClass("alert-success");

显然第一种方式更通用简洁，是优先推荐的写法。

内容的提问来源于stack exchange，提问作者Kevin Lindmark