我有一个触发了rowOnClick事件的t:datatable。这可行,但是我在列中有一个图标,当您单击该图标时,会弹出一个弹出窗口。但它也会触发rowOnClick事件。我不希望那样,对于该图标,我不希望触发rowOnClick事件。
是否有可能重写/否决数据表中某些列的rowOnClick事件。
<t:dataTable rowClasses="row1,row2" id="typelist" value="#{vehicle.vehicleTypeList}" rowOnClick="selectType(#{vehicle_types.id},#{vehicle_types.reference})">
...
...
...
<t:column id="carinformation" >
<h:outputLink styleClass="listicons" value="#" onclick="popup=window.open('vehicle/detail.xhtml?vehicleid=#{vehicle_types.id}','vehciledetails','width=800,height=500,resizable=yes,scrollbars=yes');popup.focus();return false;" >
<img src="images/information.gif" title="${msg.vehicle_information}"/>
</h:outputLink>
</t:column>
</t:dataTable>
最佳答案
DOM元素可以相互嵌套。而且,即使您单击父级的子级,父级的处理程序也可以正常工作。
原因是事件冒泡。
要停止此操作,请将event.stopPropagation();
添加到图像链接的onclick
中,如下所示:
<h:outputLink onclick="event.stopPropagation(); popup=window.open('vehicle/detail.xhtml?vehicleid=#{vehicle_types.id}','vehciledetails','width=800,height=500,resizable=yes,scrollbars=yes');popup.focus();return false;" >
<img src="images/information.gif" title="${msg.vehicle_information}"/>
</h:outputLink>
阅读更多:
event.stopPropagation()