gpt4 book ai didi

在条件下显示的 Javascript 按钮

转载 作者:行者123 更新时间:2023-11-30 06:21:12 25 4
gpt4 key购买 nike

我试图让按钮仅在显示表格时可见,但它似乎不起作用,按钮没有隐藏。

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>

最佳答案

通过统计表格标签的个数来判断是否有表格显示。不要检查空字符串,而是检查数组的长度:

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

关于在条件下显示的 Javascript 按钮,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/52960401/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com