jQuery Chrome 不接受隐藏按钮

Posted 2023-05-08

【中文标题】jQuery Chrome 不接受隐藏按钮

【英文标题】：jQuery Chrome does not accept hidden for button

【发布时间】：2019-01-21 06:00:58

【问题描述】：

我认为最近的 Chrome 和 Firefox 浏览器确实接受经典的 jQuery 命令，但事实并非如此。我计划在表单开头使用以下代码临时隐藏几个按钮（某种 CRUD）：

$(document).ready(function()
  $( "#jQtab2" ).tabs( "option", "disabled", [ 1, 2, 3 ] ); //at first
  $("#btnSave").css("visibility", "hidden"); 
  $("#btnCancel").css('visibility', 'hidden');
);

在 Firefox 中它运行良好，正如预期的那样，但顽固的 Chrome 拒绝服从。按F5刷新后，Chrome有时会隐藏btnSave，有时不会，但总是两个浏览器都隐藏btnCancel！？为什么！？ 谢谢。

【问题讨论】：

我刚刚在 Chrome 上尝试过，它可以工作。我猜你的问题在别处。请建立一个MCVE。

请提供一个 runnable minimal reproducible example 重现问题

提供你拥有的代码

代码太大。我想如何将它放在 jsFiddle 上，但与此同时我得到了可以接受的解决方案。还是谢谢。

【参考方案1】：

如果你想隐藏按钮，请尝试以下方法。

$(document).ready(function()
  $("#btnSave").css("display", "none"); 
  $("#btnCancel").css("display", "none");
);

或

$(document).ready(function()
  $("#btnSave").css("opacity", "0"); 
  $("#btnCancel").css("opacity", "0");
);

【讨论】：

谢谢。这第二个变体对我的目的来说已经足够好了，因为使用： display: none 不可能再次显示隐藏控件。但是通过改变不透明度很容易从 0 变为 100！