Ionic 3 cordova按钮单击以停止音频
Ionic 3 cordova按钮单击以停止音频
提问于 2018-05-31 16:31:46
嘿，伙计们，我遇到了一个情况，一个网格项目上有tab键和按键事件。当我按tab键时，它会播放音频1，当我按下它时，它会播放音频2。现在的问题是，当我使用多个tab键或单击键时，音频开始重叠。我需要停止以前的音频，并在按tab键或按下时再次播放，因此我克服了音频重叠的问题。
<ion-content > <ion-col (tap)="p10_1()" (press) = "p10_1l()">
<ion-grid >
<ion-row >
<div id = "container">
<div class = "sections" id = "sec1" >
A
</div><!--
--><div class = "sections" id = "sec2" >
B
</div><!--
--><div class = "sections" id = "sec3" >
C
</div>
</div>
</ion-row>
</ion-grid>
这是上面的html
import { Component } from '@angular/core';
import { NavController } from 'ionic-angular';
@Component({
selector: 'page-home',
templateUrl: 'home.html'
})
export class HomePage {
bleep: Audio;
p10_1()
{
document.getElementById("sec1").style.color = "red";
document.getElementById("sec2").style.color = "red";
document.getElementById("sec3").style.color = "red"
if (this.bleep) {
this.bleep.stop().then(() => this.bleep =
this.play('./assets/sounds/q1p10_1.mp3', true));
} else {
this.bleep = this.play('./assets/sounds/q1p10_1.mp3', true);
}
}
p10_1l()
{
if (this.bleep) {
this.bleep.stop().then(() => this.bleep =
this.play('./assets/sounds/q1p10_1l.mp3', false));
} else {
this.bleep = this.play('./assets/sounds/q1p10_1l.mp3', false);
}
}
play(x:string, black:boolean): Audio {
let bleep = new Audio();
bleep.src = x;
bleep.play();
return bleep;
}
}这是.ts
感谢大家的期待。
回答 1
Stack Overflow用户
发布于 2018-05-31 16:49:42
您应该添加您的bleep var作为控制器属性，这样您就可以在重新启动之前停止它。我已经在play()函数中实现了你的代码。你也可以使用uniqueId param，但我不知道它的行为。
export class YourComponent {
bleep: Audio;
p10_1()
{
document.getElementById("sec1").style.color = "red";
document.getElementById("sec2").style.color = "red";
document.getElementById("sec3").style.color = "red"
if (this.bleep) {
this.bleep.stop().then(() => this.bleep = this.play('./assets/sounds/q1p10_1.mp3', true));
} else {
this.bleep = this.play('./assets/sounds/q1p10_1.mp3', true);
}
}
p10_1l()
{
if (this.bleep) {
this.bleep.stop().then(() => this.bleep = this.play('./assets/sounds/q1p10_1l.mp3', false));
} else {
this.bleep = this.play('./assets/sounds/q1p10_1.mp3', false);
}
}
play(x:string, black:boolean): Audio {
let bleep = new Audio();
bleep.src = x;
bleep.play();
if (black) {
bleep.onended = function() {
document.getElementById("sec1").style.color = "black";
document.getElementById("sec2").style.color = "black";
document.getElementById("sec3").style.color = "black";
}
}
return bleep;
}
}页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/50619945
复制相关文章
相似问题