如果我在label
中有一个input
,为什么句子中的每个单词都会触发点击事件?
这里有一个**jsFiddle**的例子。无论您在第一句话中单击哪个单词,事件都将被触发。
我在input
上添加了一些CSS,这样你就可以看到,无论你鼠标在第一个标签的哪个位置,它都像是在输入上悬停一样。我还在label
中使用a
标签添加了第二个标签,它的工作方式与我期望的input
一样(当您单击标签中的单词时,单击事件不会触发)。
<label>Click <input type="submit" value="here" /> to go somewhere.</label>
<label>Click <a href="#">here</a> to go somewhere else.</label>
$('input, a').click(function() {
alert('Clicked');
});
字符串
我的两个问题是:
1.有没有一种方法可以在label
中使用input
,而label
不会触发单击事件?
1.在我的例子中,为什么click事件会触发句子中的每个单词?
1条答案
按热度按时间e4yzc0pl1#
这是HTML规范的一部分-
label
元素增加了相关input
的命中区域。您可以自己处理单击和preventDefault()
,但它不会阻止按钮UI在单击时发生变化。个字符
或者,您可以使用适当的样式将
label
元素更改为span
,以使它们的行为相同,尽管这样做会损害用户的体验。