1

我有两个元素，第一个是默认在屏幕上打印

<input id=post-category value="first">

另一个是这个，它只会显示是否进行了一些点击，当然第一个元素必须炫耀

<select id=cat-sel ><option>second</option></select>

更新我试过这段代码

el = document.getElementById("post-category");
el.style.visibility = "hidden";

el2 = document.getElementById("cat-sel");
el2.style.visibility = "visible";

但这里的问题是，第二个元素是缩进的。因为它逃脱了第一个元素的空间。我不喜欢那样，我希望他们处于同一个位置

4

2 回答 2

3

改成

el = document.getElementById("post-category");
el.style.display = "none";

el2 = document.getElementById("cat-sel");
el2.style.display = "block";

因为可见/隐藏不会删除元素在页面上占用的空间

您需要在最初需要隐藏的字段上设置 display:none

假设一个复选框有

window.onload=function() {
  document.getElementById("categoryCheckbox").onclick=function() {
    var chk = this.checked;
    document.getElementById("post-category").style.display = chk?"none":"block";
    document.getElementById("cat-sel").style.display = chk?"block":"none";
  }
}

PS：顺便说一下，显示/隐藏需要更多代码才能在重新加载后幸存下来......

于 2012-07-31T05:25:15.593 回答
0

为您的 ID 定义 CSS 并固定位置。

于 2012-07-31T05:25:02.893 回答