Question

当隐藏的输入字段更改值时，我需要播放音频文件。这个隐藏的输入位于<table>中，由Ajax刷新以更新值。

我需要做的是，（例如）当值变为是时，Clap.wav需要播放，否则，当值变为No boo.wav时必须播放。

任何人都可以给我一个这个或一个想法的示例代码？感谢那些愿意帮助的人。

以下是我的一些代码

这是隐藏的输入字段代码。它位于table.php上的id为connExcel的桌面上

<input type="hidden" name="indVal" id="indVal" value=" <?php echo $objWorksheet->getCellByColumnAndRow(5, 5)->getOldCalculatedValue();  ?> ">

以下是我的一些Ajax代码

xmlHttp.onreadystatechange=function(){ 
    if(xmlHttp.readyState==4){ 
    document.getElementById('connExcel').innerHTML=xmlHttp.responseText;
        setTimeout('AutoRefresh()',100); // JavaScript function calls AutoRefresh() every 3 seconds
    }
}
xmlHttp.open("GET","<?php if( isset( $isAdmin ) &&  $isAdmin == TRUE ){ echo  '../../library/tosloader.php?page='. $pageID; } else {  echo  ../library/tosloader.php?page='. $pageID; }  ?>",true);

'tosloader.php'只包括platinum.php来刷新表。

Answer 1

在您设置隐藏输入值的代码中执行此操作

$('#myHiddenID').val(myValue).trigger('change');

然后只需使用像这样的更改事件

$('#myHiddenID').change(function(){
     var OnOff = $(this).val();
     if (OnOff == "ON") { // play clap}
     if (OnOff == "OFF) { //play boo}
})

Answer 2

的 jsBin demo 的

HTML：

<input id="inp" type="text" value="NO" />

JS：

function checkInputValue(){ var files = { "YES": "Clap.wav", "NO": "boo.wav" }; var sound = new Audio( files[ $('#inp').val() ] ); sound.play(); } checkInputValue(); // USE WHEREVER YOU LIKE

或者您可以这样做：

为您的文件命名：yes.wav和no.wav

function checkInputValue( snd ){ var sound = new Audio( snd+'.wav'); sound.play(); } var AJAXval = ("YES").toLowerCase() ; // the returned value to lowercase checkInputValue( AJAXval );

Answer 3

听起来您正在完全添加和删除DOM中的元素，因此您需要观看DOMNodeInserted事件。幸运的是我们可以绑定它。我们假设隐藏输入的类为hiddenInput。然后我们需要获取我们的源元素，名为<source id="yesAudio"..../>和<source id="noAudio".../>，我们将使用jquery的.get()方法，然后使用HTML5音频api的.play();来调用它们

$(document).on('DOMNodeInserted', function(e){
    if(e.srcElement.className == 'hiddenInput'){
        if(e.srcElement.value == 'yes'){
            $('#yesAudio').get().play();    
        }else{
            $('#noAudio').get().play();
        }
    }        
});

我认为这就是你想要的。

隐藏输入更改值时播放音频

3 个答案: