Javascript 焦点事件侦听器未在不可编辑的输入上触发

Javascript 焦点事件侦听器未在不可编辑的输入上触发,javascript,html,forms,validation,dom-events,Javascript,Html,Forms,Validation,Dom Events,我试图让焦点事件侦听器在用户试图在地址字段中输入邮政信箱时启动。我无法编辑简单按键解决方案的输入。我的代码中缺少了哪些没有得到警报的内容 文档.添加的事件列表器(“焦点”,函数killPObox(id){ var idValue=document.getElementById('v65-onepage-shipaddr1')。值; 如果(id='v65-onepage-shipaddr1'){ 函数runVal(){ if(idValue.substr(0,4).toUpperCase()=

我试图让焦点事件侦听器在用户试图在地址字段中输入邮政信箱时启动。我无法编辑简单按键解决方案的输入。我的代码中缺少了哪些没有得到警报的内容


文档.添加的事件列表器(“焦点”,函数killPObox(id){
var idValue=document.getElementById('v65-onepage-shipaddr1')。值;
如果(id='v65-onepage-shipaddr1'){
函数runVal(){
if(idValue.substr(0,4).toUpperCase()==“PO B”| | idValue.substr(0,5)==“P.O.”){
警报(“USA Light无法发送到邮政信箱。请输入街道地址。”);
}
}
setInterval(runVal(),1);
}
}是的
);
我列出了一些问题(除了底部的解决方案):

1) 正如Halcyon提到的,您的
killPObox(id)
函数中的
id
参数被分配给事件,因此您可以通过首先获取事件的
目标
来获得所需的值,该目标将是您的

2) 正如Barmar提到的,事件监听器被添加到文档中,而不是输入元素本身

3) 正如Halcyon提到的,
setInterval()
接受函数,而不是函数的计算结果

4)
setInterval()
不是一个好的解决方案,因为这将额外运行您的检查次数。特别是当用户收到警报时,用户将持续收到警报。我们可以通过利用更合适的事件侦听器(如
input
)来解决这个问题

5)
focus
事件不适合收听。我们可以使用事件来监听您的
的值更改来修复此问题

下面的代码片段解决了上述问题。运行代码段,查看它是否按您希望的方式运行。

document.getElementById('v65-onepage-shipaddr1')
.addEventListener('input',函数killPObox(e){
var targetValue=e.target.value;
如果(targetValue.substr(0,4).toUpperCase()==“PO B”| | targetValue.substr(0,5)==“P.O.”){
警报(“USA Light无法发送到邮政信箱。请输入街道地址。”);
}
},对)

id
不是字符串,它是一个
事件
对象。您可以尝试
event.target.id
为什么要将事件侦听器添加到文档而不是输入元素?另一个需要注意的是,您使用的
setInterval
不正确。您应该向它传递一个回调,如
setInterval(runVal,1)
(注意缺少括号)。现在,您正在向它传递
runVal()
的输出,它什么都不是。该函数将运行一次,然后再也不会运行。@Barmar,我无法编辑输入。这是Volusion的锁定购物车代码。这似乎有效!奇怪的是,它在JSFIDLE中不起作用,但在stackoverflow编辑器中起作用。知道为什么吗?(我会对答案投赞成票,但我的代表太低)我的小提琴被设置为“无环绕”,而不是左侧菜单上的“加载”。现在它工作了!谢谢你愿意为我的问题投票吗,这样我就可以投票给像你这样的贡献者了?你不需要测试
e.target.id
,因为你只需要将侦听器添加到该id中。只需使用
this
来获得目标。这是非常正确的!我会修改的。
<input type="text" size="25" maxlength="75" name="ShipAddress1" id="v65-onepage-shipaddr1" value="" style="" onkeydown="">

<script type="text/javascript">  
    document.addEventListener("focus", function killPObox(id) {
        var idValue = document.getElementById('v65-onepage-shipaddr1').value;   
        if (id == 'v65-onepage-shipaddr1') {
            function runVal() {
               if (idValue.substr(0,4).toUpperCase() === "PO B" || idValue.substr(0,5) === "P.O. ") {
                    alert("USA Light cannot ship to P.O. Boxes. Please enter a street address.");
                    }
                }
                    setInterval(runVal(),1);
            }
        }, true
    );
</script>