货币转换器输入待转换金额时清空结果框的JS/jQuery实现方法

实现方案 #

你只需要给第一个金额输入框绑定内容变化监听事件，在事件触发时清空第二个结果输入框的值即可，推荐两种实现方式：

方案1：jQuery事件绑定（推荐）

在你的现有JS代码中新增以下代码即可，如果你的脚本放在页面头部，需要套入$(document).ready()回调避免DOM未加载完成导致绑定失败：

$(document).ready(function() {
  // 监听输入框所有内容变化场景：键盘输入、粘贴、剪切、自动填充等
  $('#txtLireEuro').on('input', function() {
    $('#txtConversione').val('');
  });
});

方案2：直接修改HTML标签属性

直接在第一个输入框的标签上新增oninput属性，无需额外写JS代码：

<input type="text" id="txtLireEuro" name="txtLireEuro" style="text-align:right" onkeypress="return onlyNumbers(event);" oninput="document.getElementById('txtConversione').value='';" /> &nbsp;000&nbsp;₤

说明 #

优先选择input事件而非keypress/keydown类事件，因为input事件可以覆盖所有输入框值变化的场景，不会出现粘贴、自动填充等操作时结果没有清空的问题。

内容的提问来源于stack exchange，提问作者GiovanniBGemini