Кнопка Javascript для отображения при условии - PullRequest
Новая
       1

Кнопка Javascript для отображения при условии

0 голосов
/ 24 октября 2018

Я пытаюсь сделать кнопку видимой только тогда, когда отображается таблица, но она, кажется, не работает, кнопка не скрывается.

PS: Извините, что не разъяснил, мой javascript работаетonload

HTML: 

var DLFunc = document.getElementsByTagName("table");
var DLButtons = document.getElementById("tableToCsv");
if (DLFunc == "") {
  DLButtons.style.visibility = 'hidden';
} else if (DLFunc != "") {
  DLButtons.style.visibility = 'visible';
}
<div id="view-container">
  <main ng-view></main>
</div>
<div id="tableToCsv">
  <button class="btnCSV">CSV file</button>
</div>

Полный HTML: 

    <body ng-controller="DataController">
    <header ng-include="'FixedPages/header.html'"></header>
    <div ng-include="'FixedPages/mapAHH.html'"></div>
    <div id="view-container">
      <main ng-view></main>
    </div>
    <div id="tableToCsv">
    <button class="btnCSV">CSV file</button>
    </div>
    <footer ng-include="'FixedPages/footer.html'"></footer>
     <script src="js\DownloadCSV.js"></script>
    </body>

Ответы [ 3 ]

0 голосов
/ 24 октября 2018

Проверьте, отображается ли таблица путем подсчета количества тегов таблицы.Вместо проверки пустой строки, проверьте длину массива: 

var DLFunc = document.getElementsByTagName("table");
var DLButtons = document.getElementById("tableToCsv");
if (DLFunc.length == 0) {
  DLButtons.style.visibility = 'hidden';
} else  {
  DLButtons.style.visibility = 'visible';
}

Также проверьте, когда выполняется код (возможно, добавьте предупреждение), поскольку таблицы, возможно, не были созданы во время работы вашего JS.

ОБНОВЛЕНИЕ:

Ваш JS не будет поднимать таблицу, поскольку она запускается при загрузке страницы, тогда как AngularJS, вероятно, создает элементы позже.

Вы можете добавить что-нибудькак следующее для ваших DLButtons HTML: 

<button class="btnCSV" *ngShow="hasTable()">CSV file</button>

Затем в вашем Angular Component.ts / js: 

hasTable() {
  return document.getElementsByTagName("table").length > 0;
}
0 голосов
/ 24 октября 2018

Попробуйте это: 

var DLFunc = document.getElementsByTagName("table");
var DLButtons = document.getElementById("tableToCsv");
if (DLFunc.length == 0) {
   DLButtons.style.visibility = 'hidden';
} else {
   DLButtons.style.visibility = 'visible';
}
<div id="view-container">
  <main ng-view></main>
</div>
<div id="tableToCsv">
  <button class="btnCSV">CSV file</button>
</div>
0 голосов
/ 24 октября 2018

Вы можете сделать следующее;

// you can check directly in the condition 
 const DLFunc = document.getElementsByTagName("table");
 const DLButtons = document.getElementById("tableToCsv");
 if (DLFunc)
 {
    DLButtons.style.visibility = 'hidden';
 }
 else 
 {
    DLButtons.style.visibility = 'visible';
 }
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...