javascript - 如何将数据添加到 Div 弹出窗口中

Question

我的页面上有一个按钮，显示有关特定项目的一些信息。我曾经将用户重定向到显示这些信息的页面，所以我只是使用 Action= site.com/main?var=<?=$Var?...

但是，我被要求在弹出窗口中显示此信息。所以我在 Div 弹出窗口中编码，但我真的不知道如何将数据发送到它上面。这是该 Div 内的代码:

<?php
    if(!empty($_POST['proj_id'])||!empty($_POST['task_uid']))
            die("Invalid proj_id or task_uid.");

        $query = "
        SELECT  pm.id,
                pm.proj_id,
                pm.task_uid,
                pp.task_id,
                pp.pipeline_name,
                pm.proj_pipeline_order,
                pcrs.gestor_projeto,
                pcrs.prioridade,
                pcrs.tecnologia,
                pcrs.resp_programa,
                eng.ativo

        FROM    projetos_main pm

        INNER JOIN projetos_pipeline pp
                  ON pm.task_uid = pp.task_uid

        RIGHT JOIN pcrs
                  ON pp.pcr = pcrs.num_doc

        LEFT JOIN engcom.top_issues_main eng
                  ON pcrs.num_doc = eng.pcr

                 WHERE pm.pcr = '".$_GET['pcr']."'

                 ORDER BY pm.task_uid ASC


            ";
        $result = mysql_query($query) or die(mysql_error());

        $row = mysql_fetch_array($result);


    ?>
        <tr>
    <td>
<label style='top: 5px; font-weight: bold; text-align: center'>
    PCR Information:
</label>
    </td>
    </tr>
    <table style='margin:0 auto; margin-top: 45px;'>


    <tr>
        <td><b>Pipeline:</b></td>
        <td><?=$row['pipeline_name']?></td>
    </tr>

    <tr>
        <td><b>Project Position:</b></td>
        <td><?=$row['task_id']?></td>
    </tr>

    <tr>
        <td><b>Project Manager:</b></td>
        <td><?=$row ['gestor_projeto']?></td>
    </tr>

    <tr>    
        <td><b>Portfolio Manager:</b></td>
        <td><?=$row['resp_programa']?></td>
    </tr>

    <tr>
        <td><b>Top Issue:</b></td>
        <td><?=$row ['ativo']?></td>
    </tr>

    <tr>    
        <td><b>Technology:</b></td>
        <td><?=$row ['tecnologia']?></td>
    </tr>

</table>

如您所见，我尝试在 Div 内部执行 Select。最终没有成功。另外，可能需要注意的是，此弹出窗口位于与我的主站点不同的文件中。这里的选择来自 About.php

我有一个 js 用于显示或隐藏弹出窗口:

function exibirAbout(){
    document.getElementById('popupAbout').style.display = 'block';
}

function ocultarAbout(){
    document.getElementById('popupAbout').style.display = 'none';
}

确实是非常基本的代码。这是调用该函数的按钮。它曾经位于将数据发送到新页面的表单内，但现在该表单不再有“操作”。它看起来像这样:

<form method="post" target="popupAbout">
    <input type="submit" class="submit" onclick="exibirAbout();" value="About"/>
                                    </form>

说实话，我很茫然，我不知道该怎么做，而且我在网站上找不到它。请记住，我正在工作，无法使用 Jquery，因为我们在这里不使用它。有什么想法吗？

放弃 Div 并使用 Iframe 会更好吗？这能解决任何问题吗？

Answer 1

PHP 代码在 HTML/Javascript 之前执行，因此如果您在“div 内部”执行查询并不重要。事实上，您的程序应该构造为首先执行“输入”，然后“处理”，最后“输出”。当您混合输出和处理时，您可能会遇到问题(例如，如果您想发送重定向 header )。

然后，您可以在生成站点时将所有数据写入(隐藏)div，并在特定事件上显示它。但看来您需要 POST 请求的信息...那么您的解决方案是 AJAX(JS 向 PHP 脚本发送请求而不重新加载整个页面)。在这种情况下，您可以动态添加结果。 请注意:AJAX 是 Javascript 技术，并非特定于 jquery。你可能不想使用 jquery，但你必须使用 javascript。不过，我推荐一个 JS 库，因为它让生活更轻松。

最后一个站点说明:不要对按钮使用“onclick”，而对表单使用“onsubmit” - 无需单击提交按钮即可提交表单!