Question

我正在编写一段代码，可以将屏幕上的某些灯光从红色变为绿色，并等待用户按下与灯光对应的按键。

当我运行此代码时，您可以点击a，d，j或l键并弹出警报。但是，只要单击开始按钮，就不会识别任何键。当循环结束时，绑定似乎仍然被禁用。我试过将绑定移动到其他地方，但我没有快乐。非常感谢您的帮助。

$( function() {
$('#start').bind('click', function() { main(); });
$(document).bind('keypress', function(e) { keyPress(e); } );
} );



function getRand(val) {
   return Math.floor(Math.random()*val)+1;
}

function main() {

preD = new Date;
preDs = preD.getTime();
randTime=Math.floor(Math.random()*1001)+1500;

playSound();
flash();
}

function flash() {

zone = getZone();

setTimeout(function() {
    $('#r'+zone).css("background-image", "url(images/rea_grn.jpg)");
    setTimeout(function() { 
        $('#r'+zone).css("background-image", "url(images/rea_red.jpg)");
        if(cond[1] < 8) {
            main();
        }
    } , 200);
} , randTime);
}

function getZone() {

if(condition==1) {
    zone = getRand(2);
    if( test[1][zone] < 8 ) {
        test[1][zone] += 1;
        cond[1] += 1;
        return zone;
    } else {
        getZone();
    }
}
}

function keyPress(e) {
var evtobj=window.event? event : e //distinguish between IE's explicit event object (window.event) and Firefox's implicit.
var unicode=evtobj.charCode? evtobj.charCode : evtobj.keyCode
var actualkey=String.fromCharCode(unicode)
if (actualkey=="a" || actualkey=="d" || actualkey=="j" || actualkey=="l" ) {
    dd = new Date;
    reat = dd.getTime();
    alert(1);
    //keypressed[condition][zone]['k']=actualkey;
    //keypressed[condition][zone]['t']=(reat-preDs);
}
}

Answer 1

可能发生这种情况的原因是，当您动态生成代码或更改任何现有代码时，需要再次执行绑定，因为绑定函数只运行一次并且仅对已创建的成员运行。因此，当您创建动态代码时，您将被迫运行绑定功能以识别新元素。

这种方式不是很推荐，而不是这样，你可以绑定像'div'这样的容器，并且在这个内部验证哪个元素正在调用你。这将起作用，因为您的容器已创建一次并且绑定已正确分配，并且如果容器的内容发生更改无关紧要，则绑定始终有效。

此致

Answer 2

使用jQuery声音插件是答案。

使用以下命令修复此问题：plugins.jquery.com/project/sound_plugin

在javascript递归循环中，Jquery绑定不起作用

2 个答案: