按钮未触发JavaScript函数，请求技术排查帮助

我创建了一个按钮，本应触发JavaScript函数调用jsProcess，但添加alert测试后发现完全没触发，请问为什么按钮无法触发对应的函数？

相关代码如下：

$(document).ready(function() {
  $("#btnProcess3").attr("disabled", "disabled");
  alert("hi")
  jsProcess(0);

  $("#btnProcess3").click(function() {
    alert("hi")
    $(this).attr("disabled", "disabled");
    jsProcess(1);
  });
});

function jsProcess(action) {
  var page;
  var sDate;
  var sBizDate;
  sDate = $('#txtDate').val();

  if ($('#chkuseBizDate').is(':checked')) {
    sBizDate = $('#txtBizDate').val();
  } else {
    sBizDate = sDate;
  }
  page = "LoadPPSFile_details01.asp?TaskId=<%=sTaskId %>&txtDate=" + (sDate) + "&RunProcess=" + action + "&txtBizDate=" + (sBizDate);
  document.getElementById("IProcess").src = page;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.1/jquery.min.js"></script>
<input type="button" name="btnProcess" id="btnProcess3" value="Start - Services" width="250" style="VISIBILITY:show; WIDTH: 150px; HEIGHT: 22px; Background-Color:#1E90FF; Border-Color:white; Color:white; Font-Weight:bold;Font-family:Verdana;Cursor:hand; "
/>

核心问题：按钮初始被设置为禁用状态 #

在页面初始化的$(document).ready方法里，第一行就执行了$("#btnProcess3").attr("disabled", "disabled");，这会直接让按钮处于不可点击的禁用状态，自然触发不了后续绑定的点击事件。

解决方法 #

1. 移除初始禁用代码：如果按钮不需要一开始就禁用，直接删掉这行$("#btnProcess3").attr("disabled", "disabled");代码即可。
2. 按需启用按钮：如果需要满足特定条件（比如输入框有值）才启用按钮，可以添加监听逻辑，示例如下：

   // 监听输入框变化，当txtDate有值时启用按钮
   $('#txtDate').on('input', function(){
     if($(this).val().trim() !== ''){
       $("#btnProcess3").removeAttr("disabled");
     } else {
       $("#btnProcess3").attr("disabled", "disabled");
     }
   });
   

3. 补充异常防护：在jsProcess函数里对依赖元素做存在性校验，避免因元素不存在导致报错：

   function jsProcess(action) {
     var page;
     var sDate = '';
     var sBizDate = '';
     // 校验txtDate是否存在
     if($('#txtDate').length){
       sDate = $('#txtDate').val() || '';
     }
     // 校验chkuseBizDate和txtBizDate是否存在
     if ($('#chkuseBizDate').length && $('#chkuseBizDate').is(':checked')) {
       sBizDate = $('#txtBizDate').val() || '';
     } else {
       sBizDate = sDate;
     }
     // 编码参数避免乱码，同时校验IProcess元素
     page = "LoadPPSFile_details01.asp?TaskId=<%=sTaskId %>&txtDate=" + encodeURIComponent(sDate) + "&RunProcess=" + action + "&txtBizDate=" + encodeURIComponent(sBizDate);
     var iframe = document.getElementById("IProcess");
     if(iframe){
       iframe.src = page;
     }
   }
   

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