在同一个 Web html 页面中获取结果

Posted

技术标签:

【中文标题】在同一个 Web html 页面中获取结果【英文标题】:Get result in the same Web html page 【发布时间】:2015-12-08 20:41:40 【问题描述】:

我没有办法执行我的 html/php 网页。

这是场景:

从正文部分的 html 网页中,我加载了一个 php 脚本,该脚本从 mysql db 中检索数据并将其呈现在表中,然后将其返回到初始网页的部分中。 当我得到这张表时,Id(第一列)上有一个链接,假设通过点击它可以在同一页面的另一个部分提供信息,但它没有。 它在另一个网页上显示它的信息。

这是主要的html代码:

<html>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="http://www.w3schools.com/w3css/w3.css">
<head>
<style>
#header 
    background-color:black;
    color:white;
    text-align:center;
    padding:5px;

#section 
    width:100%;
    float:left;
    padding:5px;         

#footer 
    background-color:black;
    color:white;
    clear:both;
    text-align:center;
    padding:5px;    
    text-shadow: 1px 1px;   

</style>
<script>
function getStudentStatus(Id) 
    if (Id == "") 
        document.getElementById("StuStat").innerHTML = "";
        return;
     else  
        if (window.XMLHttpRequest) 
            // code for IE7+, Firefox, Chrome, Opera, Safari
            xmlhttp = new XMLHttpRequest();
         else 
            // code for IE6, IE5
            xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
        
        xmlhttp.onreadystatechange = function() 
            if (xmlhttp.readyState == 4 && xmlhttp.status == 200) 
                document.getElementById("StuStat").innerHTML = xmlhttp.responseText;
            
        
        console.log("looking for :"+Id);
        xmlhttp.open("GET","getStudentStatus.php?StudentId="+Id,true);
        xmlhttp.send();
    

function getStudentInfo(Id) 
    if (Id == "") 
        document.getElementById("StuInfo").innerHTML = "";
        return;
     else  
        if (window.XMLHttpRequest) 
            // code for IE7+, Firefox, Chrome, Opera, Safari
            xmlhttp = new XMLHttpRequest();
         else 
            // code for IE6, IE5
            xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
        
        xmlhttp.onreadystatechange = function() 
            if (xmlhttp.readyState == 4 && xmlhttp.status == 200) 
                document.getElementById("StuInfo").innerHTML = xmlhttp.responseText;
            
        
        console.log("looking for :"+Id);
        xmlhttp.open("GET","getStuInfo.php?StudentId="+Id,true);
        xmlhttp.send();
    


var intShowResult = setInterval(function() getStudentStatus("q") ,60000);

</script>
</head>
<body onload="getStudentStatus('q')">

<div class="w3-container w3-orange">
  <h1>Student Status</h1> 
  <h4>test bed</h4>
</div>
<br><br><br>

<div id="section">
<p>Result: <span id="StuStat"></span></p>
</div>

<div id="footer">
Copyright © xxxxxx.com
</div>



<div id="StuInfo">
<p>Cycle Info of:<span id="StuInfo"></span></p>
</div>


</body>
</html>

有什么想法吗? /库尔

【问题讨论】:

【参考方案1】:

尝试从body标签中删除onload="getStudentStatus('q')",注释掉var intShowResult = setInterval(function() getStudentStatus("q") ,60000); 并尝试在最后将其添加到您的 javascript 中。

第一次调用getStudentStatus 发生在页面完成加载之前,因此如果它成功执行,则 html 中没有容器元素来接受响应。调用函数前确保页面内容已完全加载。

function initialise()
    call getStudentStatus(this,'q');
    setInterval( function()  getStudentStatus('q') , 60000 );


document.addEventListener('DOMContentLoaded',initialise,false);

【讨论】:

RamRaider,我已尝试应用您所说的内容,但仍提供一个新的网络文档来显示单击的链接 (getStudentInfo)。结果不会转到 StuInfo 部分。

以上是关于在同一个 Web html 页面中获取结果的主要内容,如果未能解决你的问题,请参考以下文章

如何获取嵌入在 PhantomJS 运行的 JS 的 HTML 页面结果中的 JSON 对象并将它们传递给 java 代码?

浅谈Swift如何快速获取Web页面中图片资源的大小

如何使 Web 部件页面内的 HTML 内容可搜索?

如何在Hugo中获取页面资源的完整路径?

获取web页面xpath

手机web页面怎么调用摄像头执行扫描,获取数据?