如何让jQuery忽略select下拉菜单中的默认禁用选中选项

你默认选中的第一个option是disabled状态，且value为空字符串""，Chrome、Safari、Brave等主流浏览器调用$("#menuPlazos").val()时会直接返回选中项的空值，parseInt("")的计算结果就是NaN，只有Firefox对选中的禁用选项做了特殊兼容处理，所以才出现跨浏览器运行效果不一致的问题。

你可以按需选择以下任意一种方案解决问题： #

方案1：取值时主动过滤禁用选项+容错校验（最稳妥） #

封装统一的取值方法，自动跳过禁用的选中项，从根源避免拿到无效值：

function getPlazosValidVal() {
  // 仅获取选中的非禁用option的value
  const selectedVal = $("#menuPlazos option:selected:not(:disabled)").val();
  // 转换为数字，无效值返回null或者你自定义的默认值
  return selectedVal ? parseInt(selectedVal) : null;
}

把你代码里parseInt($("#menuPlazos").val())的部分直接替换为getPlazosValidVal()即可，同时可以加判断：如果返回值为null，就提示用户先选择期限、阻断提交流程。 #

方案2：优化原有计算函数，增加空值拦截 #

修改cambiarValorTasas函数，提前判断选中项有效性：

function cambiarValorTasas() {
  const selectedOpt = $("#menuPlazos option:selected");
  // 选中项为禁用状态/value为空时直接返回，不赋值
  if(selectedOpt.is(":disabled") || !selectedOpt.val()) {
    $("#tasasSeleccion").html("");
    return null;
  }
  const val = parseInt(selectedOpt.val());
  switch(val) {
    case 12:
      $("#tasasSeleccion").html(3.95);
      break;
    case 24:
      $("#tasasSeleccion").html(4.19);
      break;
    case 36:
      $("#tasasSeleccion").html(4.36);
      break;
    default:
      $("#tasasSeleccion").html("");
  }
  return $("#tasasSeleccion").text() || null;
}

方案3：调整HTML默认选中逻辑（可选） #

如果你不需要保留提示项的默认选中状态，可以把selected属性从禁用的option转移到第一个有效选项上：

<option type="number" value="" disabled>Elegi una Opcion</option>
<option type="number" value="12" selected>12 meses</option>

页面加载时默认就会选中有效值，不会出现空值问题。 #

调用client.creacionClientes前建议加一层数值有效性校验，避免把NaN传递给后端：

const plazosVal = getPlazosValidVal();
const tasasVal = parseFloat(tasas);
const cuotaVal = parseFloat($(".valorCuota").text());
// 任意数值无效就阻断提交，给出提示
if(isNaN(plazosVal) || isNaN(tasasVal) || isNaN(cuotaVal)) {
  alert("请完善所有必填的数值选项");
  return;
}
// 校验通过再调用接口
client.creacionClientes(
  $("#nombre").val(),
  $("#apellido").val(),
  $("#mail").val(),
  parseInt($("#aSolicitar").val()),
  plazosVal,
  tasasVal,
  cuotaVal.toFixed(2)
);

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