Question

我在尝试构建基于MySQL数据库生成其内容的移动应用时遇到了以下问题。我的问题是，当我想从页面“A”转到页面“B”时，页面“B”完全为空，除非在新选项卡中打开页面“B”，在这种情况下，它显示所请求的内容而没有任何内容缺陷。

我使用的代码（简化）：

<div data-role="page" id="main">
    <div data-role='header' data-position='fixed'>
        <a href='#home' class='ui-btn-right' data-icon= 'home' data-iconpos='notext'  data-direction='reverse'></a>
        <h2>Activities</h>
    </div>
    <?php
    //(I'll keep the login and connection code out since it is irrelevant to the problem)

    $result = mysql_query("SELECT DISTINCT profession FROM members",$mysql) or die("");
    $query_amount = mysql_query("SELECT richting, COUNT(*) AS aantal FROM sport GROUP BY profession",$mysql) or die("");
    $query_membernr = mysql_query("SELECT membernr FROM members",$mysql) or die("");


    while(list($r) = mysql_fetch_row($query_amount))
    {

       $profession[]=$r;

            print ("
            <div data-role='content'>
              <ul data-role='listview' data-inset='false' id='pag1'>
                        <li>
                        <a href='index.php?richtingstack=$r#2a'>
                        <img src='images/something.jpg' height='80' align='middle' />
                        <p><h2> 
                        $r
                        </h2></p>
                        </a>
                     </li>
              </ul>
            </div>
            <div data-role='footer' data-position='fixed'><h2>Kies een activiteit</h2>
            </div>"
            ) ;


    }

    ?>


</div>

此页面（页面“A”）完美运行，由所请求数据的menas生成。它创建了一个来自所有数据库用户的专业列表。（成员）

当有人按下此列表中的某个按钮时，它应该转到一个页面（不重新加载整个应用程序），其中包含此职业适用的成员列表。此页面是第2a页，并与GET变量组合。

出于某种原因，当我单击其中一个按钮时，页面＃2a会出现，但除了页眉和页脚之外完全没有内容，这两个页面都没有生成。

但是，如果我右键单击其中一个按钮并在新选项卡中打开链接（在不同的选项卡中重新加载应用程序，那么说）它完美无缺。如果有人能告诉我我做错了什么以便我可以继续下去，我会真的感到高兴。

Answer 1

如果您想要一个没有重新加载的动态网站，请使用AJAX。

Answer 2

PHP无法在运行后创建内容。

您正在搜索的是AJAX（异步JavaScript和XML）。基本上，它允许您从任何地方提取内容，而无需重新加载页面。客户端部分是纯JavaScript。例如，您可以加载页面http://yourdoma.in/index.php?tab=B，然后将div data-role="content"替换为该页面中的文字。

就个人而言，我更喜欢将jQuery用于AJAX，因为使用纯javascript进行所有错误处理会使编写和读取变得非常烦人。你可以找到jQuery AJAX-Documentation here。或者，如果您想使用纯javascript，here。

Answer 3

为此，您只需使用Ajax即可帮助您而无需重新加载页面。假设像这样

 $.ajax({
    url: "test.php",
    type: "post",
    data: data of you want,
    success: function(content){
        $("#B").html(content);
    },
    error:function(){

        $("#B").html('Content loaded problem');
    }
});

生成包含数据的页面而不重新加载页面

3 个答案: