js在文本字段中输入时停用空格键答案

【问题标题】：js deactivate spacebar when typing in textfieldjs在文本字段中输入时停用空格键
【发布时间】：2011-06-09 20:41:55
【问题描述】：

我正在创建一个音乐播放器，它使用空格键暂停和播放音频，现在可以知道是否有人当前正在输入文本字段，因为现在，如果该用户输入文本字段并且正在播放音频，当用户按下空格时，音频会暂停，我基本上希望当用户不在文本字段中时，用户可以播放和暂停音频，但是当用户键入时，此功能被禁用，因此音频继续播放。下面的代码是我当前用于检测何时按下空格的代码；

//IF Space bar is Pressed
$(window).keypress(function(e) {
if(e.keyCode == 32) {
    if(document.getElementById('audio').paused){
        if(document.getElementById('video').style.display=="block"){

        }
        else{
            document.getElementById('audio').play();
            document.getElementById('pause').style.display="block"; 
            document.getElementById('play').style.display="none";
        }
    }
    else{
        if(document.getElementById('video').style.display=="block"){

        }
        else{
            document.getElementById('audio').pause();
            document.getElementById('pause').style.display="none";
            document.getElementById('play').style.display="block";
        }
    }
}
});
//END IF Space bar is pressed

【问题讨论】：

标签： javascript audio textfield space

【解决方案1】：

查看事件源tagName属性：

function(e) {
 e = e || event;
 var el = e.srcElement || e.target,
     cando = !(/textarea|input/i.test(el.tagName));

 if(cando && e.keyCode == 32)  {
   /etc.
 }
}

【讨论】：

天才 :)，我不明白大部分内容，我必须阅读它，但谢谢 :)

【解决方案2】：

你也可以试试

if(e.keyCode == 32 && document.activeElement != document.getElementById('someTextBox'))

新代码

//IF Space bar is Pressed
$(window).keypress(function(e) {
if(e.keyCode == 32) {
    var inputs = document.getElementsByTagName('input');

    for(var item in inputs)
    {
        if(inputs[item] == document.activeElement)
            return;
    }

    if(document.getElementById('audio').paused){
        if(document.getElementById('video').style.display=="block"){

        }
        else{
            document.getElementById('audio').play();
            document.getElementById('pause').style.display="block"; 
            document.getElementById('play').style.display="none";
        }
    }
    else{
        if(document.getElementById('video').style.display=="block"){

        }
        else{
            document.getElementById('audio').pause();
            document.getElementById('pause').style.display="none";
            document.getElementById('play').style.display="block";
        }
    }
}
});
//END IF Space bar is pressed

【讨论】：

这行得通，但&& document.activeElement != document.getElementByTagName('input') 不行……为什么？
谢谢，这也有效，但 KooiInc 更快 :(，但你的答案也是正确的 :)

【解决方案3】：

检查文本区域是否有焦点

if(e.keyCode == 32 && !text_area_has_focus) { ...

如果你愿意使用 jQuery，逻辑可能是这样的：

if(e.keyCode == 32 && !$('input[type=text]:focus').length) { ...

【讨论】：

hmmmmmm，这不起作用，这完全停止了音频被暂停或通过空格键播放，无论是否输入:(
@Lenny，你只是复制粘贴了吗？因为你实际上必须实现设置 text_area_has_focus 的逻辑......
hmmmm，是的，这就是我坚持的一点我明白你做了什么，但你知道如何检测文本字段是否有焦点吗？