Question

当用户试图输入P.O时，我正试图让焦点事件监听器触发。框到地址字段。我无法编辑简单的按键解决方案的输入。我的代码中缺少什么，我没有收到警报？

<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>

Answer 1

我列出了一些问题（除了底部的解决方案）：

1）正如Halcyon所提到的，id函数中的killPObox(id)参数已分配给事件，因此您可以通过首先获取事件的target来获取所需的值这将是您的<input>。

2）正如Barmar所提到的，事件监听器被添加到文档而不是输入元素本身。

3）正如Halcyon所提到的，setInterval()接受函数而不是函数的求值结果。

4）setInterval()不是一个好的解决方案，因为这会使你的支票无关紧要。特别是当用户收到警报时，用户将不断收到警报。我们可以通过利用更合适的事件监听器来解决这个问题，例如input。

5）focus事件不是一个好听的事件。我们可以使用input事件来解决此问题，以收听<input>。

的值更改

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

＆＃13;

document.getElementById('v65-onepage-shipaddr1')
  .addEventListener('input', function killPObox(e) {
    var targetValue = e.target.value;
    if (targetValue.substr(0, 4).toUpperCase() === "PO B" || targetValue.substr(0, 5) === "P.O. ") {
      alert("USA Light cannot ship to P.O. Boxes. Please enter a street address.");
    }
  }, true);

＆＃13;

<input type="text" size="25" maxlength="75" name="ShipAddress1" id="v65-onepage-shipaddr1">

＆＃13;

焦点事件监听器不会触发不可编辑的输入

1 个答案: