javascript - 在可点击的文章中创建一个可点击的 div (HTML5)

Question

我目前正在尝试将一些可点击的 div 放入文章标签 (HTML5) 中。现在，问题是我的文章也是可点击的，所以每当我尝试点击我的 div 时，它只是假定我正在点击文章。我的点击监听器是用 javascript 设置的，这是我的代码:

HTML:

<article id='one'>
<div id='somediv' class='up'>Stuff</div>
</article>

当然，这只是我尝试做的一个例子。

Javascript:

    articles = document.getElementsByTagName('article');
for (var i = 0; i < articles.length; i++) {
    articles[i].addEventListener('click',redirect,false);
}

var UpVote = document.querySelectorAll(".up");
for (var i = 0, length = nodeList.length; i < length; i++) {
    UpVote[i].addEventListener('click',UpVote,false);
}
function UpVote(){
    alert(this.id);
}

正如您在这里看到的，我有 2 个循环为我的所有文章对象和 .up 类对象设置监听器。我确信这些有效，功能也是如此。我没有发布我的重定向功能，因为我确信它有效，我得到了我的重定向。

我的 CSS:

.up{
display:block;
padding-left:3px;
background:rgba(150,195,225,.4);
border-radius:5px;
-webkit-box-shadow:1px 1px 2px rgba(110,110,110,.1);
width:20px;
-webkit-transition: width .3s;
}

这篇文章也被设置为一个区 block 。

感谢您的帮助!

Answer 1

研究事件冒泡和捕获。当您单击 div 时，您也单击了文章，因此重定向将首先触发并可能阻止调用 up vote。