禁用的元素不会触发鼠标事件。大多数浏览器会将源自禁用元素的事件沿 DOM 树向上传播，因此可以将事件处理程序放置在容器元素上。但是，Firefox 不会表现出这种行为，当您单击禁用的元素时，它什么也不做。

我想不出更好的解决方案，但是，为了完全跨浏览器兼容性，您可以在禁用输入的前面放置一个元素，然后点击该元素。这是我的意思的一个例子：

<div style="display:inline-block; position:relative;">
  <input type="text" disabled />
  <div style="position:absolute; left:0; right:0; top:0; bottom:0;"></div>
</div>​

jq：

$("div > div").click(function (evt) {
    $(this).hide().prev("input[disabled]").prop("disabled", false).focus();
});​

示例：http : //jsfiddle.net/RXqAm/170/（更新为使用 jQuery 1.7prop代替 attr）。

禁用的元素在某些浏览器中“吃掉”点击——它们既不响应它们，也不允许它们被元素或其任何容器上的任何位置的事件处理程序捕获。

恕我直言，“修复”此问题的最简单、最干净的方法（如果您确实需要像 OP 那样捕获对禁用元素的点击）只是将以下 CSS 添加到您的页面：

input[disabled] {pointer-events:none}

这将使对禁用输入的任何点击落入父元素，在那里您可以正常捕获它们。（如果您有多个禁用的输入，您可能希望将每个放入一个单独的容器中，如果它们还没有以这种方式布置 - 一个额外的<span>或一个<div>，比如说 - 只是为了便于区分哪个禁用的输入被点击）。

缺点是不幸的是，这个技巧不适用于不支持pointer-eventsCSS 属性的旧浏览器。（它应该适用于 IE 11、FF v3.6、Chrome v4）：caniuse.com/#search=pointer-events

如果您需要支持较旧的浏览器，则需要使用其他答案之一！

也许您可以将该字段设为只读并在提交时禁用所有只读字段

$(".myform").submit(function(e) {
  $("input[readonly]").prop("disabled", true);
});

并且输入（+ 脚本）应该是

<input type="text" readonly="readonly" name="test" value="test" />

$('input[readonly]').click(function () {
  $(this).removeAttr('readonly');
});

一个活生生的例子：

$(".myform").submit(function(e) {
  $("input[readonly]").prop("disabled", true);
  e.preventDefault();
});


$('.reset').click(function () {
  $("input[readonly]").prop("disabled", false);
})

$('input[readonly]').click(function () {
  $(this).removeAttr('readonly');
})

input[readonly] {
  color: gray;
  border-color: currentColor;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<form class="myform">
  <input readonly="readonly" value="test" />
  <input readonly="readonly" value="test" />
  <input readonly="readonly" value="test" />
  <input readonly="readonly" value="test" />
  <input readonly="readonly" value="test" />
  <input readonly="readonly" value="test" />
  <input readonly="readonly" value="test" />
  <input readonly="readonly" value="test" />
  <input readonly="readonly" value="test" />
  
  <button>Submit</button>
  <button class="reset" type="button">Reset</button>
</form>

我会建议一个替代方案 - 使用 CSS：

input.disabled {
    user-select : none;
    -moz-user-select : none;
    -webkit-user-select : none;
    color: gray;
    cursor: pointer;
}

而不是禁用属性。然后，您可以添加自己的 CSS 属性来模拟禁用的输入，但具有更多控制权。