如何隱藏小部件框中的某些類？

所以有一個按鈕，它打開一個帶有多個字段的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"; 
    }

它不工作由於某種原因...任何幫助，將不勝感激！謝謝！

來源

2015-06-16 user3851283

是代碼叫什麼名字？放一個調試器並檢查會發生什麼。你的代碼是正確的，據我所知 –

顯然，當我在webapp中看到它時，它沒有實現更改 – user3851283

你正在調用testFunc和函數funcTest。我已經測試過它，它的工作方式與你實施它的方式一樣。只要確保聲明和調用中的函數名稱相同即可。檢查這個小提琴：https：//jsfiddle.net/zxs8ekdp/ – andresigualada

你的HTML是無效

我已經做了修正，請找

而且你的函數名也是不正確

JSFieldhttp://jsfiddle.net/sachinkk/n4njbmbr/

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);

<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>

來源

2015-06-16 16:28:28 Sachink

確保您的JavaScript在document.ready聲明中。這是爲了讓您的JavaScript在DOM完全加載後運行。

如果您希望通過jQuery快速完成此操作，請查看document.ready。

如果您想在香草JavaScript中做到這一點，this previous answer應該做的伎倆。

來源

2015-06-16 16:11:26

它可以幫助

<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"; 
    }

來源

2015-06-16 16:20:39 user1846871

如何隱藏小部件框中的某些類？

回答

相關問題