Question

我有两个文本框，其值为yes和no。当我在第一个文本框中键入yes时，它会发出蜂鸣声，并且在剩余文本框中也会发生相同的情况。当我输入正确的值到相应的文本框时，声音应该只播放。在我的情况下，声音一次又一次地重复......不知道可能是什么原因..

<input type="text" id="question"/>
<input type="text" id="question1"/> 
<audio src="beep.mp3" id="mp3" preload="auto"></audio>

function checkResults() {

    if ($('#question').val().toLowerCase() == 'yes') {
            document.getElementById("mp3").play();

    }

    if ($('#question1').val().toLowerCase() == 'no') {
        document.getElementById("mp3").play();
    }


}

$('input').blur(checkResults);

Answer 1

我认为这是由于窗口onblur事件，你需要检查事件目标，以确保它不是窗口。

<input type="text" id="question"/>
<input type="text" id="question1"/> 
<audio src="beep.mp3" id="mp3" preload="auto"></audio>
<script>
var isWindow = false;

function checkResults() {
    if (!isWindow) {
        if ($('#question').val().toLowerCase() == 'yes') {
            document.getElementById("mp3").play();
        }

        if ($('#question1').val().toLowerCase() == 'no') {
            document.getElementById("mp3").play();
        }
    }
}

$('input').blur(checkResults);

$(window).focus(function() {
    isWindow = false;
});

$(window).blur(function(e) {
    isWindow = true;
});
</script>

音频重复不止一次

1 个答案: