在 asp 链接按钮内启用 span onclick

Question

在我们的网页上，我们有一个搜索功能，可以根据事件是打开的还是关闭的事件加载事件列表。每个事件都有自己的 ID。当事件加载时，它是一个带有事件名称、日期、事件管理员名称的块，都在一个 asp:LinkBut​​ton 中，它会触发一个 javascript 回发。如果您单击此块内的任何位置，它会加载有关该事件的快速信息。

我想要完成的是，如果活动已打开，请在 asp:LinkBut​​ton 中放置一个链接，该链接会将用户带到活动的详细信息页面。知道我不能嵌套标签，但客户要求链接在同一个块内。

这是一个关闭事件的示例。这工作正常：

<div id="EventList">
    <a id="EventList_lnkEventListItem_0" class="list-item show-overlay" href="javascript:__doPostBack()">
        <span class="event-date col-md-48 col-sm-48">
            02/02/2017                                        
        </span>                                    
        <span class="event-name col-md-48 col-sm-48"></span> 
        <span class="EventCoordinator-name col-md-48 col-sm-48">
            Started by: Me 
        </span>
        <div class="col-md-48 text-sm">
            Status: Closed
        </div>

        <br class="list-item-clear" />
    </a>
</div>

这是我需要链接的打开事件的示例，我添加了一个显示示例的跨度：

<div id="EventList">
    <a id="EventList_lnkEventListItem_0" class="list-item show-overlay" href="javascript:__doPostBack()">
        <span class="event-date col-md-48 col-sm-48">
            02/02/2017                                        
        </span>                                    
        <span class="event-name col-md-48 col-sm-48"></span> 
        <span class="EventCoordinator-name col-md-48 col-sm-48">
            Started by: Me 
        </span>
        <span class="startedby-name col-md-48 col-sm-48" onclick="window.open(/events/scheduledevents?eventid=####, '_blank')">
            Open Event in New Window
        </span>

        <div class="col-md-48 text-sm">
            Status: Open
        </div>

        <br class="list-item-clear" />                                    
    </a>
</div>

如何将事件 id 的 asp 变量放入 onclick 事件中？有没有更好的方法来完成任务？

Answer 1

stopPropagation() 将阻止通知任何父处理程序。你可以这样尝试：

function parentFunction(){
  console.log('parent fired');
}

function childFunction(event)
{
  event.stopPropagation(); // you can comment this line and see the difference
  console.log('child fired');
}

$('.item-button').click(function(event) {
     event.stopPropagation();

<a href="#" onclick="parentFunction();">
  Lorem ipsum
  <br/>
  <br/>
  <span onclick="childFunction(event);">
    Child button
    </span>
  
  <br/>
  <br/>
  Still parent
  </a>