如何判断输入是否含指定字符？修复JS条件判断失效问题

核心问题分析 #

原代码的if条件始终不触发，根源有两点：

• 直接将DOM元素对象与字符串"n"做比较，没有读取输入框的value属性
• 需求是包含字符"n"，但代码用了严格相等判断，无法匹配"包含"的场景

另外else分支的计算逻辑也存在错误：把单个输入框当成数组处理，使用arr.length和arr[i].value完全不合理，因为field1和field2都是单个<input>元素，并非元素集合。

修复后的代码 #

JavaScript代码 #

function findTotal() {
  // 获取输入框的实际输入值
  var field1Val = document.getElementById('field1').value;
  var field2Val = document.getElementById('field2').value;
  var field3 = document.getElementById('field3');
  var tot = 0;

  // 判断输入值是否包含字符"n"
  if (field1Val.includes("n") || field2Val.includes("n")) {
    field3.value = "n";
  } else {
    // 转换为数值并处理非数字输入的情况
    var num1 = parseFloat(field1Val);
    var num2 = parseFloat(field2Val);
    if (!isNaN(num1) && !isNaN(num2)) {
      tot = num2 - num1;
    } else {
      // 输入非数字时清空结果框，也可根据需求改为提示文本
      tot = "";
    }
    field3.value = tot;
  }
}

HTML代码（保持原结构无需修改） #

<input type="text" maxlength="1" id="field1" name="field1" onblur="findTotal()" />
<input type="text" maxlength="1" id="field2" name="field2" onblur="findTotal()" />
<input type="text" maxlength="1" id="field3" name="field3" />

关键修复说明 #

• 读取输入框的value属性，而非直接用DOM对象做比较
• 使用includes()方法判断字符串是否包含指定字符，贴合需求逻辑
• 修正计算逻辑：单个输入框直接取值，添加非数字输入的容错处理
• 优化变量命名，提升代码可读性

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