第一次单击后按钮禁用效果不起作用

Question

我正在使用jQuery禁用按钮。它确实有效，但Chrome中有一种奇怪的行为。如果我点击按钮，它将保持未禁用的颜色：

仅当我再次点击或移动鼠标（至少1像素）时，该按钮才会显示为已禁用：

这是我的代码：

<button id="reset" type="button">Reset</button>

$('#reset').click(function(){
    $(this).attr('disabled',true);
});

出于某种原因，它在演示中运行良好：http://jsfiddle.net/hjqk00j4/

在我的localhost版本中，我尝试剥离部分页面，js块，css部分等，但它仍然不会显示禁用的按钮版本，除非我再次点击它。有什么想法吗？

Answer 1

试试这个

$('#reset').click(function(){
   $(this).attr('disabled',true);
   $(this).attr('disabled',false);
});