如何在我的情況下隱藏和顯示div邊框線？

Question

我有一個div元素：

<div id="fruit-part"> 
     <input type="radio" name="fruits" value="apple">Apple 
     <input type="radio" name="fruits" value="orange">Orange 
</div> 

我的CSS定義DIV邊框顏色

#fruit-part { 
    border: 1px solid #cc3; 
} 

通過使用jQuery：$('#fruit-part').hide()和$('#fruit-part').show()我可以很容易地隱藏和顯示裏面的內容div，但不是div邊界線。

正如你在上面看到的，我的div有一個邊框線，顏色爲「＃cc3」，我在想如何使用jQuery來隱藏和顯示div邊框線？

Answer 1

移動你的CSS屬性的一類，然後添加/刪除fruit-part這個類。

.bordered { 
    border: 1px solid #cc3; 
} 

#fruit-part {} 

$('#fruit-part').addClass('bordered'); 
$('#fruit-part').removeClass('bordered'); 

Answer 2

使用jQuery的css方法：

$("#fruit-part").css("border", ""); 

Answer 3

/* CSS */ 
.noborder { border: 0; } 
//Hide border 
$('#fruit-part').addClass('noborder'); 
//Show border 
$('#fruit-part').removeClass('noborder'); 

Answer 4

$('#fruit-part').css('border', '');和$('#fruit-part').css('border', '1px solid #cc3');

Answer 5

你可以使用$('#fruit-part').toggle();顯示和隱藏整個股利。

演示 - http://jsfiddle.net/hNxQ5/