Question

想知道是否有人经历过这个。每次点击工具提示时，我都会尝试e.preventDefault()。单击它时，它会加载带有YouTube视频的iframe。但是，preventDefault()在这种情况下不执行任何操作。我使用了javascript调试器，它正在查找spanClick()函数。

这是奇怪的事情发生。当我从课程部分删除'fa'时，preventDefault()有效。因此，当class="fa-question-circle right has-tip tip-left"时，preventDefault会起作用，iframe视频会加载。但是，Font Awesome问号图标不会加载，显然是因为类中缺少'fa'。

Font Awesome图标是否存在已知问题绕过preventDefault，或者在spanClick()发生之前或之后创建另一个“点击”事件？

提前致谢。下面是应该相互交互的代码。

<a href="http://www.youtube.com/INSERTYTLINK"><span data-width="250px" data-tooltip="" class="fa fa-question-circle right has-tip tip-left" onclick="spanClick()" title="Watch the video for more information"></span></a>

<script type="text/javascript">
function spanClick(e) {
    e.preventDefault();
}
</script>

编辑：当我在firefox上检查元素时，我发现当点击发生时，此事件就会被连接起来。我可以在我的标记中改变或阻止任何内容吗？

function() {
  if ($(this).parents('.sfSubscribe').length) {
    $(this).parents('.sfSubscribe').find('input:submit').click();
  } else if ($(this).parents('.sfsearchBox').length) {
    console.log('asd');
    $(this).parents('.sfsearchBox').find('input:submit').trigger('click');
  } else {
    $(this).parents('form').submit();
  }
}

Answer 1

那是因为onclick处理程序附加到span元素，它不会重定向，锚点会执行，并且它是必须要阻止的锚点击，而不是点击在跨度上，无论是否有气泡都会阻止

您还需要将事件添加为参数

<a href="http://www.youtube.com/INSERTYTLINK" onclick="spanClick(event)"><span data-width="250px" data-tooltip="" class="fa fa-question-circle right has-tip tip-left" title="Watch the video for more information"></span></a>

<script type="text/javascript">
function spanClick(e) {
    e.preventDefault();
}
</script>

FIDDLE

还可以使用e.stopPropagation在范围

上停止事件冒泡

Answer 2

您也将该事件称为onclick='spanClick()'，但未传递事件对象，例如onclick='spanClick(event)' e为undefined，除非您这样做。见这里：https://jsfiddle.net/fj00bpev/

Answer 3

在调用函数时，您忘记提供事件作为参数 spanClick

演示：http://jsfiddle.net/1jc9cfdd/

<a href="http://www.youtube.com/INSERTYTLINK">
    <span data-width="250px" data-tooltip="" class="fa fa-question-circle right has-tip tip-left" onclick="spanClick(event)" title="Watch the video for more information">hello
    </span>
</a>

<script type="text/javascript">
function spanClick(e) {
    e.preventDefault();
}
</script>

在应用css图标时，preventDefault（）无法正常工作？

3 个答案: