在我的情况下如何隐藏和显示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');