我有一個表,如下面的片段顯示。表tr和td有奇怪的點擊事件
$(function(){
$('.table-price td.go-to-price').click(function(){
console.log($(this).attr('data-link'));
goToLink($(this).attr('data-link'));
})
$('.table-price tr.go-to-product').click(function(){
console.log($(this).attr('data-link'));
goToLink($(this).attr('data-link'));
})
})
function goToLink(url) {
location.href = url ;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table class="table-price">
<tr class="go-to-product" data-link="http://tahrircenter.com/product/correction-pens/url">
<td>1</td>
<td>10013</td>
<td>عنوان</td>
<td></td>
<td>10</td>
<td>
<p class="">0</p>
</td>
<td class="go-to-price" data-link="http://tahrircenter.com/product/correction-pens/url#price-change" >
<a href="http://tahrircenter.com/product/correction-pens/url#price-change">IMAGE</a>
</td>
</tr>
</table>
的tr
有data-link
屬性和最後td
有不同的data-link
屬性,但是當我點擊tr
元素,網站導航,而不是到URL td
元素, tr
元素。
使用事件stopPropagation –