Question

您好，我正在尝试根据文本框内的内容来启用/禁用某些按钮。使用'backspace'事件时，我想通过每个操作检查文本框的内容，以便按钮的启用/禁用状态相应地更改。 'backspace'将用于删除文本框中的内容，但是根本没有检测到'backspace'（使用console.log进行测试）。

以下是代码（它适用于'c'而不适用于'backspace'）：

document.addEventListener("keypress", function(event) 
{
  if (event.key == "c") 
  {
    console.log("C Pressed");
    document.getElementById("btnConvert").click();
  }

  var convertButton = document.getElementById("btnConvert");
  if (event.key == "Backspace") 
  {
    console.log("Backspace Pressed");
    var textboxContent = document.getElementById("txtFahrenheit").value;
    if (textboxContent.value == "" || textboxContent.value == "-")
    {
      convertButton.disabled = true;
    }
  }
})

<button id="btnConvert" onclick="convertPressed()">Convert</button>
<input id="txtFahrenheit" type="text" onkeypress="return fNumOnly(event);" autofocus />

我如何获取它来检测何时按下“退格键”？我用其他字母进行了测试，并且效果很好，还尝试执行“ event.keyCode == 8”，但未检测到任何东西。

Answer 1

您应该使用keydown而不是keypress来正确检测Backspace：

document.addEventListener("keydown", function(event) 
{
  if (event.key == "c") 
  {
    console.log("C Pressed");
    document.getElementById("btnConvert").click();
  }

  var convertButton = document.getElementById("btnConvert");
  if (event.key == "Backspace") 
  {
    console.log("Backspace Pressed");
    var textboxContent = document.getElementById("txtFahrenheit").value;
    if (textboxContent.value == "" || textboxContent.value == "-")
    {
      convertButton.disabled = true;
    }
  }
})

<button id="btnConvert">Convert</button>
<input id="txtFahrenheit" type="text" autofocus />

Answer 2

$(document).keyup(function(e)
{
    if(e.key == "c")
    {
        alert("C Pressed");
        document.getElementById("btnConvert").click();
    }
    var convertButton = document.getElementById("btnConvert");

    if(e.keyCode == 8)
    {
        alert('backspace trapped');
        var textboxContent = document.getElementById("txtFahrenheit").value;
        if (textboxContent.value == "" || textboxContent.value == "-")
        {
          convertButton.disabled = true;
        }
    }
});

<button id="btnConvert" onclick="convertPressed()">Convert</button>
<input id="txtFahrenheit" type="text" autofocus />

JavaScript AddEventListener-退格键

2 个答案: