如何在不同的html div中的php文件中显示不同的回声

时间:2016-02-24 19:29:06

标签: javascript php jquery html ajax

我有2个文件:html和php。 HTML 文件通过javascript将变量发送到php。 PHP 调用perl文件 1-处理数据。 2-然后在一些<table><tr><td>中显示结果。

我想用HTML 1-在某个div中显示处理语句。 //这成功了 2-在另一个div中显示结果。 //怎么做?

javascript function
{
   var url = "file.php";
   var params = //some parameters;
   var xhttp = new XMLHttpRequest();
   xhttp.onreadystatechange = function() 
{
    if (xhttp.readyState == 4 && xhttp.status == 200){
    document.getElementById("ProcessingDiv").innerHTML = xhttp.responseText;     //This div show text about processing the data.

    document.getElementById("ResultDiv").innerHTML = //How to do this?
                }
        };
       xhttp.open("POST", url, true);
       xhttp.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
       xhttp.send(params);
    }

PHP文件的一些代码:

// some echo "processing data statement" here are displayed in ProcessingDiv

// statement which execute perl is here (the process takes 10 min and generate some files)

//I want below echos to displayed in ResultDiv

if(!file_exists($filename)) {
    echo "<p>No comparison meets cutoff criterion. </p>";
    }else {
    echo "<p><table border = 1 width=100% class='sortable'>";
    echo "<thead><tr><th>Query</th><th>Subject</th><th>Score</th</tr>  </thead>";
    echo "<tbody>";
    if($i == 0) {
        echo "<tr><td>$element[1]</td><td><input type='checkbox'>$target_name</td><td>$element[3]</td><td>$element[4]</td></tr>";
    }else{
                  //another echo
    }

可以在两个不同的div中显示php echos吗?

注意: 我的系统行为:

  1. 浏览器加载HTML文件,该文件从用户输入并通过单击某个按钮将表单输入发送到php文件。

  2. 单击按钮时,在调用perl文件&#34;之前显示php&#34;中的所有回声。在ProcessingDiv中。但是在击败perl后,如何在另一个div中显示其他回声?

  3. 注意 我尝试使用:

    jQuery.ajax({
           type: "POST",
            url: "blastresult.php",
            data:params,
            dataType: "html",
            success: function(data)
            {
                jQuery('#result').html(data);
    
            }
        });
    

    它做同样的工作。在perl执行之前呈现回声。

    希望你明白我的观点。 任何帮助都非常感谢。 谢谢,

2 个答案:

答案 0 :(得分:0)

使用Ajax在html页面上显示php echo:

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>

<script type="text/javascript">
function displayOutput()
{
    var dataString = "name=abc&gender=male";
    $.ajax({
        type: "POST",
        url: "file.php",
        data: dataString,
        dataType: "html",
        success: function(data)
        {
            $('#myDiv').html(data);

        }
    });

}

</script>

答案 1 :(得分:0)

我通过seplit响应文本来解决问题:

var xhttp = new XMLHttpRequest();
   xhttp.onreadystatechange = function() 
{
    if (xhttp.readyState == 4 && xhttp.status == 200){
    var parts = xhttp.responseText.split("--seperator---");
    document.getElementById("ProcessingDiv").innerHTML = parts[0];
    document.getElementById("ResultDiv").innerHTML = parts[1];
                }

谢谢大家。