Jquery 为什么不是'；这个toggleClass（）不工作吗？

我在jQuery中有一个相当直接的类切换。然而，我一辈子都搞不明白为什么它不能按预期运行

单击标签上的任意位置时，

的类应切换如果您单击复选框，它将按预期工作。但是，如果您单击其他任何位置，则不会发生切换

$（'.xtrag p'）。在（'click'，function（）上{
$（this.toggleClass（'row9'）；
});
.xtrag{
利润率：40像素；
}
p{
利润率：10px0；
}
.row0{
背景：#eee；
填充：4px8px；
}
.row9{
背景：#ffd；
}
.rt{
浮动：对；
}
标签{
显示：内联块；
宽度：100%；
}


项目1


项目2


项目1

改为测试复选框的更改。标签触发了另一次点击


$（'.xtrag input'）。在（'change'，function（）上{
$（this）.toggleClass（'row9'）；
});
.xtrag{
利润率：40像素；
}
p{
利润率：10px0；
}
.row0{
背景：#eee；
填充：4px8px；
}
.row9{
背景：#ffd；
}
.rt{
浮动：对；
}
标签{
显示：内联块；
宽度：100%；
}


项目1


项目2


项目1

这是因为您的
输入
弹出
单击
事件，您会收到两个事件调用，而不是一个

一种方法是停止输入冒泡，另一种方法是检查事件目标：


$（'.xtrag p'）。在（'click'，函数（e）上{
if（typeof$（e.target）.attr（'type'）！='undefined'）{
$（this.toggleClass（'row9'）；
}
});
.xtrag{
利润率：40像素；
}
p{
利润率：10px0；
}
.row0{
背景：#eee；
填充：4px8px；
}
.row9{
背景：#ffd；
}
.rt{
浮动：对；
}
标签{
显示：内联块；
宽度：100%；
}


项目1


项目2


项目1

不确定是谁否决了这一点。它解决了这个问题。谢谢。在我看来，在目标上测试一个类型的存在有点笨拙。为什么不切换复选框，就像我在回答中显示的那样？是的，对不起。我正在测试这两种解决方案。。。。。和创建打字错误：）现在设置：）谢谢。