無論如何要以編程方式隱藏jQuery UI按鈕？

我想要做這樣的事情，與jQuery UI Button：無論如何要以編程方式隱藏jQuery UI按鈕？

$button.button(); 
// ... 
$button.button('hide'); 
// ... 
$button.button('show');

方式類似，enable/disable作品。隱藏和手動顯示按鈕（$button.hide();$button.show();）導致一些真正棘手的格式與jQuery UI CSS ...

我在這裏錯過了一些簡單的東西嗎？

來源

2011-05-06 neezer

只要做標準$button.hide()應該做的很好，究竟是什麼搞砸了？

你可以做$button.css('display', 'none')但這就是所有$button.hide()無論如何。

我很確定沒有辦法來做你所問的，即使它只會設置顯示：沒有像我剛剛提到的方法。你可能會更好地弄清楚爲什麼設置顯示沒有將你的CSS搞砸在頁面的其他地方。

來源

2011-05-06 16:09:28 jcvandan

這個問題（我最好說的是）我需要實例化隱藏元素上的按鈕，jQuery UI似乎並不喜歡。我不認爲它可以計算出適當的尺寸或其他東西。我已經檢查過了，沒有其他與之相關的衝突CSS（只是股票UI CSS）。我想我可以製作按鈕，然後隱藏它，但是然後我得到那個「閃光」，我寧願避免... – neezer 2011-05-06 16:16:53

我明白，這是煩人的 - 你是如何創建按鈕？ – jcvandan 2011-05-06 16:18:58

按鈕隱藏着一個CSS類'hidden'。當DOM被加載時，我用'$（'a＃some-button.hidden'）。button（）;'創建按鈕。然後，當我用'$（'a＃some-button.hidden'）。show（）;'在代碼中顯示它們時，它們看起來都是重擊（它們看起來像全寬度塊元素，沒有頂部/底部邊框和沒有背景）。如果我在按鈕上執行完全相同的過程，而這些過程最初並不是通過'.hidden'隱藏的，它們渲染得很好。 – neezer 2011-05-06 16:54:24

如果使用visibility而不是display，則該按鈕應該能夠正確創建。 visibility: hidden風格只是使元素不可見; $ .hide（）使用的display: none樣式實際上會從渲染的DOM中移除元素。

因此，在短期試：

var newButton = $('a#some-button.hidden'); 

// Hide element, but allow it to use render space 
newButton.attr('visibility', 'hidden'); 
newButton.attr('display', 'block'); 

// Create button 
newButton.button(); 

// Revert element to the "normal" means of hiding (may be unnecessary) 
newButton.attr('display', 'none'); 
newButton.attr('visibility', 'visible'); 

// Show button 
newButton.show();

我已經收到此做一些時間。

來源

2011-05-06 20:08:16 JoshNaro

這是一箇舊的，我知道，但是...不是定義最初隱藏在CSS中的按鈕，而是使用一類ui-helper-hidden來定義它。這樣它將被隱藏，直到你實例化它。 display：none隱藏一個元素，它不會佔用任何空間。該元素將被隱藏，並且該頁面將顯示爲該元素不存在。這與隱藏按鈕不同，因爲它應該仍佔用屏幕空間。

如果你需要它最初留下隱患實例化後，可以將其隱藏

$elem.button().hide();

所得的jQuery UI按鈕將顯示：inline-block的，重寫UI輔助隱藏的顯示：無。

我從來沒有遇到與渲染奇怪的問題，所以你的問題可能有一個潛在的問題。

來源

2012-05-25 12:22:45

**This might be easy for you: 
Try this code:** 
<html> 
<head> 
<script src="jquery.js"></script> 
<script> 
$(document).ready(function(){ 
$("p").click(function(){ 
$(this).hide(); 
}); 
}); 
</script> 
</head> 
<body> 
<p>If you click on me, I will disappear.</p> 
<p>Click me away!</p> 
<p><button id="demo"/>Hide me</button></p> 
</body> 
</html>

來源

2012-11-26 09:47:40 Lucky