Question

所以有一个按钮，它打开一个包含多个字段的widgetbox窗口：boldColumn containerLabel和fieldColumn containerField。

<tr>
   <td class="boldColumn containerLabel">
       <span class="widgetLabel boldLabel ">Address</span>
   <td class="fieldColumn containerField">
       <-- Contains a field box -->
</tr>
<tr>
   <td class="boldColumn containerLabel">
       <span class="widgetLabel boldLabel ">Zip Code</span>
   <td class="fieldColumn containerField">
       <-- Contains a field box -->
</tr>

我想知道，我怎样才能隐藏第一行（即第一个containerLabel和containerField）？

这是我到目前为止所做的......

document.getElementById("nxw_bulkImportDocuments_form").addEventListener("click", testFunc);
    function funcTest() {
          var label = document.getElementsByClassName("boldColumn containerLabel");
          var field = document.getElementsByClassName("fieldColumn containerField");

          label[0].style.visibility = "hidden";
          field[0].style.visibility = "hidden";
     }

由于某种原因它不起作用...任何帮助将不胜感激！谢谢！

Answer 1

确保您的JavaScript位于document.ready语句中。这样就可以在DOM完全加载后运行JavaScript。

如果您希望使用jQuery快速完成此操作，请查看document.ready。

如果您希望在vanilla JavaScript中执行此操作，this previous answer应该可以解决问题。

Answer 2

它可能会有所帮助

<tr  class="cond">
   <td class="boldColumn containerLabel">
       <span class="widgetLabel boldLabel ">Address</span>
   <td class="fieldColumn containerField">
       <-- Contains a field box -->
</tr>
<tr class="cond">
   <td class="boldColumn containerLabel">
       <span class="widgetLabel boldLabel ">Zip Code</span>
   <td class="fieldColumn containerField">
       <-- Contains a field box -->
</tr>

javascript

document.getElementById("nxw_bulkImportDocuments_form").addEventListener("click", testFunc);
    function funcTest() {
          var field = document.getElementsByClassName("cond");
          field[0].style.display = "none";
     }

Answer 3

您的HTML无效

我已经做了更正，请找

您的功能名称也不正确

JSField http://jsfiddle.net/sachinkk/n4njbmbr/

＆＃13;

 function funcTest() {
     var label = document.getElementsByClassName("boldColumn");
     console.log(label.length);
     var field = document.getElementsByClassName("fieldColumn containerField");

          label[0].style.visibility = "hidden";
          field[0].style.visibility = "hidden";
     }
document.getElementById("nxw_bulkImportDocuments_form").addEventListener("click", funcTest);

＆＃13;

<table>
<tr>
   <td class="boldColumn containerLabel">
       <span class="widgetLabel boldLabel ">Address</span>
    </td>
   <td class="fieldColumn containerField">
       <!-- Contains a field box -->fsfs
       </td>
</tr>
<tr>
   <td class="boldColumn containerLabel">
       <span class="widgetLabel boldLabel ">Zip Code</span>
    </td>
   <td class="fieldColumn containerField">
       <!-- Contains a field box -->fsf
    </td>
</tr>
</table>
       
       <button id="nxw_bulkImportDocuments_form">click </button>

＆＃13;

如何隐藏小部件框中的某些类？

3 个答案: