如何禁用 javascript 中的图像按钮？

Question

我有网格的完整代码。正如您在此 PICTURE 中看到的，我在 jqgrid 中有一个图像按钮类型。我希望图像按钮被禁用 Status 不是 Pending，如果它处于 Pending 状态，则 button/s 被启用。对于下面我尝试 *.attr("disabled",true); 的代码不起作用，我仍然可以单击我的按钮并触发该功能。我正在使用 jquery.

的 <= jquery 1.8.2 版本

function FiTATimeCorrectionV2(FAId, drpStatus) {
  var url1 = '../Request/GetFitaTimeCorrectionV2?FAId=' + FAId + '&drpStatus=' + drpStatus;
     $("#FiTATimeCorrectionV2List").jqGrid({
      url: url1,
      datatype: 'json',
      mtype: 'POST',
      colNames: ['rowId', 'FitaAssignDtlID', 'FitaAssignID', 'Date', 'Time In1', 'Time Out1', 'Time In2', 'Time Out2', 'Time In1', 'Time Out1', 'Time In2', 'Time Out2', 'Remarks', 'Status', '', ''],
      colModel: [
                { name: 'rowId', index: 'rowId', hidden: true, width: 20 },
                { name: 'FitaAssignDtlID', index: 'FitaAssignDtlID', hidden: true, editable: true, sortable: false, width: 20, align: 'center' },
                { name: 'FitaAssignID', index: 'FitaAssignID', hidden: true, editable: true, sortable: false, width: 90, align: 'center' },
                { name: 'Date', index: 'Date', hidden: false, editable: true, sortable: false, width: 85, align: 'center' },
                 { name: 'FitaIn1', index: 'FitaIn1', width: 70, align: 'center' },
                 { name: 'FitaOut1', index: 'FitaOut1', width: 70, align: 'center' },
                  { name: 'FitaIn2', index: 'FitaIn2', width: 70, align: 'center' },
                 { name: 'FitaOut2', index: 'FitaOut2', width: 70, align: 'center' },
                  { name: 'FitaCorIn1', index: 'FitaCorIn1', width: 70, align: 'center' },
                 { name: 'FitaCorOut1', index: 'FitaCorOut1', width: 70, align: 'center' },
                  { name: 'FitaCorIn2', index: 'FitaCorIn2', width: 70, align: 'center' },
                 { name: 'FitaCorOut2', index: 'FitaCorOut2', width: 70, align: 'center' },
                 { name: 'FitaCorRemarks', index: 'FitaCorRemarks', width: 73, align: 'center' },
                 { name: 'FitaStatus', index: 'FitaStatus', width: 70, align: 'center' },
                 { name: 'FitaCorForApproval', index: 'FitaCorForApproval', width: 50, align: 'center' },
                 { name: 'FitaCorForDisApproval', index: 'FitaCorDisForApproval', width: 50, align: 'center' },
   ],
      pager: $('#FiTATimeCorrectionV2Pager'),
      rowNum: 5,
      rowList: [5, 10, 20],
      sortname: 'FADate',
      sortorder: 'desc',
      viewrecords: true,
      imgpath: '/Content/themes/redmond/images/',
      height: '100%',
      afterInsertRow: function (rowid) {
          var obj = jQuery("#FiTATimeCorrectionV2List").getRowData(rowid);
          var FADTLSID = obj.FitaAssignDtlID;
          if (FADTLSID !== undefined) {
              if (FADTLSID !== "") {
                  var btnApprove = "<img  alt='' src='../../Content/Images/newimages/check.png' style='height:20px;width:20px;'  style ='width: 90px' id='btnApproved" + rowid + "' onclick='clickmeapproved(" + rowid + " )' />"
                  var btnDisApprove = "<img  alt='' src='../../Content/Images/newimages/delete.png' style='height:20px;width:20px;' style ='width: 90px' id='btnDisApproved" + rowid + "' onclick='clickmedisapproved(" + rowid + " )' />"
                  jQuery("#FiTATimeCorrectionV2List").setRowData(rowid, { FitaCorForApproval: btnApprove });
                  jQuery("#FiTATimeCorrectionV2List").setRowData(rowid, { FitaCorForDisApproval: btnDisApprove });
                  var temp = obj.FitaStatus;
                  if (temp == "Approved") {
                     $("#btnApproved" + rowid).attr("disabled", true);
                     $("#btnDisApproved" + rowid).attr("disabled", true);
                     }
                  else if (temp == "Disapproved") {
                      $("#btnApproved" + rowid).hide();
                      $("#btnDisApproved" + rowid).hide();
                  } else {
                     $("#btnApprove" + rowid).attr("disabled", false);
                      $("#btnDisApprove" + rowid).attr("disabled", false);
                   }
              }
          }
      },
      loadComplete: function () {
          var ids = jQuery("#FiTATimeCorrectionV2List").getDataIDs();
          var len = ids.length;            
          if (len < 5) {
              AddNewRowToGrid(len, "#FiTATimeCorrectionV2List");
          }
        }
  });

如果我使用 *.prop("disabled",true) 我得到这个错误 Uncaught TypeError: $(...).prop is not a function

Answer 1

对于所有查看我的 post 的人，我找到了解决方案。我应该从一开始就尝试一下，但我不确定它是否会起作用。但现在它解决了我的问题。

这是我的回答，我只是添加 input type='image'

var btnApprove = "<input type = 'image' img alt='' src='../../Content/Images/newimages/check.png' style='height:20px;width:20px;' style ='width: 90px' id='btnApproved" + rowid + "' onclick='clickmeapproved(" + rowid + " )' />"

现在工作正常。

如何禁用 javascript 中的图像按钮？

How to disable image button in javascript?

javascript

jquery

jqgrid