我有一個可點擊的div的問題。點擊不同的圖標到它已經有一個點擊事件的div
這是一個Ionic 2音頻應用程序。我有一個列表中有不同圖標的div。
更確切地說,每個div包含兩個可以單擊的圖標,一個可以下載音頻,另一個可以播放。
我需要點擊每個圖標,爲每個圖標執行適當的行爲,但是當點擊包含div的任何其他部分時,它必須具有與播放按鈕相同的行爲,以便它播放音頻。
問題是,如果我附加事件點擊父母的div,這取消了我兒童圖標的其他事件。所以當點擊下載或播放圖標時,它總是播放音頻,因爲我確實點擊了父div。
這是我的代碼:
<div class="audioItem" ion-item *ngFor="let audio of audios" (click)="tryToPlay(audio)">
<img id="leftIcon" src="img/[email protected]">
<h3>{{ audio.name }}</h3>
<div *ngIf="audio.downloaded">
<img class="downloadIcon" src="img/[email protected]" (click)="clicked(audio)">
</div>
<div *ngIf="!audio.downloaded">
<img class="downloadIcon" src="img/[email protected]" (click)="clicked(audio)">
</div>
<div id="play" *ngIf="!audio.locked">
<img id="arrowIcon" src="img/[email protected]" (click)="tryToPlay(audio)">
</div>
<div *ngIf="audio.locked">
<img id="lockIcon" src="img/ui-lock100.png" (click)="tryToPlay(audio)">
</div>
</div>
注意,點擊()方法僅適用於測試的東西,這將是任何其他的「下載()」方法。這裏重要的是知道如何允許點擊兒童圖標。
我不知道這件事。我通過應用css的相對和絕對位置解決了這個問題,這是一個非常牽強的問題,正如我在下面的自己的答案中所說的......但我認爲你的解決方法要好得多,非常感謝! –
很高興聽到! :) – sebaferreras