Question

我正在尝试创建一个可以使用其他输入清除的输入，但是当使用退格键/删除键删除/删除文本时，清除按钮必须隐藏。

我能以任何方式做到这一点吗？

HTML：

  <form action="#" id="cse-search-box" METHOD="GET">
    <div>
      <input type="text" name="q" id="q" value="some value" size="35" autocomplete="off" onfocus="if (this.value == '') { document.getElementById('search_form_input_clear').style.background='#FFFFFF' };" onkeydown=" document.getElementById('search_form_input_clear').style.background='#000000'">

      <input id="search_form_input_clear" class="search_form_input_clear" type="button" value="X" OnClick="document.getElementById('q').value=''; document.getElementById('q').focus();" style="background: #FFFFFF; border: none; font-weight: bold; color: #FFFFFF;">
      <input type="submit" value="Search" class="submit" />
    </div>
  </form>

JavaScript的：

  var clearbut = document.getElementById('search_form_input_clear');
  var searchfield = document.getElementById('q');
  if (searchfield.value != '') {
      clearbut.style.background='#000000'; 
  }
  else if (searchfield.value === '') {
      clearbut.style.background='#FFFFFF'; 
  }

Answer 1

向onkeyup添加一个监听器。当密钥释放发生时，会调用一个函数来检查输入字段值。如果它是空的，请将其隐藏起来。

Answer 2

使用此密钥而不是您使用的keydown功能

onkeyup="if (this.value == '') { document.getElementById('search_form_input_clear').style.background='#FFFFFF' };"

元素

中的

它会起作用

Answer 3

简单：向onchange添加事件监听器。检查侦听器中的值。如果它为空，则隐藏按钮。

当文本从输入中完全删除时执行某些操作

3 个答案: