Question

我目前有一个按钮，当我按下它时，它下面会出现一个表格。我无法弄清楚的第一个问题是，虽然我指定了border =“10”，但我无法获得边框。我正在使用Firefox。接下来我无法弄清楚如何完成我的表格，以便能够按下按钮并隐藏表格。我的第三个问题是这个表是作为测试编写的，用于查看我的jsp中变量和参数的状态是我认为的。在我的第三个单元格中，我只有docs，我想要getDocs（）页面上的当前值。如果我把它放在getDocs（）中，那么它会在页面加载时给出结果，该结果为null。但是在我运行调试器的showDiv（）方法中，它在var docs = getDocs（）;中显示了正确的getDocs值。如何获取文档中的文档值。

window.onload = function()
{
    document.getElementById("button").onclick = showDiv;
}

function showDiv()
{
    document.getElementById("hidden").style.display = "block";

    var docs = getDocs();
}



 <input type="button" id="button" value="Click to show states" onclick="showDiv()"/>

  <div id="hidden" style="display:none"> 
        <table border="10" style="width:300px">
        <tr>
          <td>Type</td>
          <td>Object</td>
         <td>value</td>
        </tr>
        </br>
        <tr>
          <td>Element 1</td>
          <td><%=docs%></td>
          <td>docs</td>
        </tr>
        </table> 
  </div>

Answer 1

1）border是一个css样式属性，因此将其应用于css文件中。

#foo (yourid)
{
    border: 10px;
}

2）您必须创建按钮并创建onClick（）函数（JavaScript）。此函数将检索表（可能由id）然后将显示更改为无

var table = document.getElementById("foo);
table.style.display = none;

3）不确定这个。

Answer 2

对于边框问题，如果将边框定义放在样式声明中会发生什么：

<table style="width:300px;border:1px solid black;">

为了显示/隐藏，可以将一个简单的切换器放入showDiv（）调用中。尝试：

function showDiv() {
    if (document.getElementById('hidden').style.display == 'block') {
        document.getElementById('hidden').style.display = 'none';
    }
    else {
        document.getElementById('hidden').style.display = 'block';
    }
}

需要更多代码示例和解释来处理文档问题。

Answer 3

我不确定我会在这里回答每个问题，但无论如何你都去了：http://jsfiddle.net/bbtVH/8/

您只需要此javascript，因为您在按钮上使用HTML属性onclick，无需在window.onload中添加监听器：

function showDiv() {
    var table = document.getElementById("hidden");
    if (table.style.display !== "block"){
        table.style.display = "block";
        // Just get docs from JSP, if you want to get its value :
        // var docs = <%=docs%>;
    }
    else {
        table.style.display = "none";
    }
}

这个CSS会为你的单元格提供2px的边框：

td{
    border: 2px solid black;
}

Answer 4

为你的边界：

<table border="10" style="width:300px border: 5px solid red; display:none">

隐藏表格：

$("#hidden").fadeOut("slow");

或看到它：

$("#hidden").fadeIn("slow");

从docs获取值：

 docs.val()

获取要打印的变量的状态

4 个答案: