javascript - onclick 删除，html

Question

我正在使用 webapp-net 为 iOS/android 构建应用程序。在我的应用程序中，我有一个带有一些文本字段的表单。我想要一个“X”图标，它通常在输入时出现在文本字段上。通过单击该图标，您只需单击一下即可删除整个输入。图标“X”仅在输入时出现，当文本字段为空时图标不可见。如果您能举例说明如何操作，我将不胜感激。

Answer 1

这个简单的 html 展示了如何拥有一个输入字段和一个在按下时调用干净函数的 X 按钮

<input type="text" onkeypress="show();" id="text" /><div id="close" onclick="clean();" style="display:none">x</div>

现在是javascript

<script type="text/javascript">
   function show(){
      document.getElementById('close').style.display = ''; //shows the X button when text is entered;
   }

   function clean(){
      document.getElementById('close').style.display = 'none'; //hides the X button
      document.getElementById('text').value = ""; //clears the field
   }
</script>

当然这缺少验证，例如按下什么类型的键以避免在您按下 SHIFT 或 CTRL 时显示 X 按钮