<button id="ntpqBtn">加载NTP服务器状态</button> <pre id = "ntpq"></pre> <script> $(document).ready(function(){ function loadOutput(){ var xhttp = new XMLHttpRequest(); xhttp.onreadystatechange = function(){ if(this.readyState == 4 && this.status == 200){ var ntpqTable = document.getElementById("ntpq"); ntpq.innerHTML = this.responseText; } }; xhttp.open("GET","ntp2.php",true); xhttp.send(); } $("#ntpqBtn").click(function(){ loadOutput(); setInterval(loadOutput,1000); }); }); 添加一个再次点击隐藏内容的功能
时间: 2024-02-10 22:09:20 浏览: 14
您可以添加一个变量来跟踪内容是否应该显示,然后在按钮点击事件中根据其值来显示或隐藏内容。以下是一个可能的解决方案:
```
$(document).ready(function(){
var showingOutput = false; // 初始时不显示输出内容
var ntpqTable = document.getElementById("ntpq");
function loadOutput(){
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function(){
if(this.readyState == 4 && this.status == 200){
ntpqTable.innerHTML = this.responseText;
}
};
xhttp.open("GET","ntp2.php",true);
xhttp.send();
}
function toggleOutput() {
showingOutput = !showingOutput; // 切换显示状态
if (showingOutput) {
ntpqTable.style.display = "block";
} else {
ntpqTable.style.display = "none";
}
}
$("#ntpqBtn").click(function(){
toggleOutput(); // 点击按钮时切换显示状态
if (showingOutput) {
loadOutput(); // 如果要显示内容,则加载输出
setInterval(loadOutput,1000); // 并定时刷新
}
});
});
```
在这个解决方案中,我们添加了一个名为showingOutput的变量来跟踪内容是否应该显示。在toggleOutput函数中,我们切换显示状态,并根据需要设置内容的display属性。在按钮点击事件中,我们首先调用toggleOutput函数来切换显示状态,然后根据需要加载内容和定时刷新。
相关推荐
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![docx](https://img-home.csdnimg.cn/images/20210720083331.png)
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![docx](https://img-home.csdnimg.cn/images/20210720083331.png)