Question

我的页面中有一个小部件。如果我点击小部件的任何部分，它应该导航到下一页，其中包含有关该小部件的一些细节。如果我点击该小部件中可用的名为“likes”的跨区，我需要打开一个对话框。但即使我点击该链接，它也会导航到下一页..

如果我点击除该链接之外的小部件的任何部分，它应该导航到下一页..

这是点击的常规代码：

 $('td#' + parentElement).find('div.streamcontenttopmain').click(function() {
            window.location.href = 'TaskDetails.aspx?id=' + json_row.id + '&community=' + getQueryParam('community');
        });

如果我点击小部件中的任何地方

，此代码将导航到下一页

我的范围定义如下：

<span class="flft likes" style="MARGIN-LEFT: 2px">

这就是我的尝试：

 $('td#' + parentElement).find('div.streamcontenttopmain').click(function (e) {

            if ($(this).hasClass("flft likes")) {

                alert("hi");
            } else {
                window.location.href = 'TaskDetails.aspx?id=' +
                               json_row.id +
                               '&community=' +
                               getQueryParam('community');
            }
        });

Answer 1

您可以阻止事件冒泡到div元素并触发其事件处理程序：

$('#' + parentElement).find('span.likes').click(function(e) {
    e.stopPropagation();

    // ...
});

Answer 2

如果你停止事件的传播，你可以在它到达div的范围内处理它。那个看起来类似于下面的

$('td#' + parentElement).find('div.streamcontenttopmain').click(function(e){
      window.location.href = 'TaskDetails.aspx?id=' + 
                               json_row.id + 
                               '&community=' + 
                               getQueryParam('community');
})).find('span.likes').click(function(e) {
           e.stopPropagation();
           //do the span specific stuff here
});

Answer 3

您还可以执行以下操作：

$(document).ready(function(){
    $('div').click(function(e){
        if(e.toElement.nodeName == "SPAN")
            alert('span clicked');
        else
            alert('div clicked');
    });
});

我在此演示中展示了它：http://jsfiddle.net/SxhWy/3/

在jquery中点击功能需要帮助

3 个答案: