0

我浏览了很多教程和博客，但我无法在代码中实现我需要的东西。有人可以帮我吗？

我正在尝试创建一个网站。基本结构（fields.html）是，它包含两个文本字段 X 和 Y 以及一个提交按钮。（所有这三个都放在一个表单中）。基本上，当您在两个文本框中输入一些值并按下提交按钮时，（它将连接到 query.php(action=”query.php”)，我在其中编写了获取值的代码（x 和 y ) 从fileds.html 并根据接收到的值（x 和y），query.php 将从数据库中获取一些值并使用echo 命令显示这些结果）值列表将显示在同一页面中。我为此使用了 JQuery。

所以这是我的要求和我面临的问题：

要求：

（我只需要页面中的功能：http: //nix.lv/history/demo.html （右键单击此页面，您可以查看页面源）但在此页面中它正在加载静态页面（通过锚选项卡) 但我想加载基于 FIELDS.HTML 值动态运行的 QUERY.PHP（通过单个提交按钮）

A. 每当我在文本框（x 和 y）中输入值时，这些值应显示在同一页面中 - （已使用工作 -JQuery）。B. 每当我按下刷新按钮时，已经显示的结果不应该消失。只需刷新页面并显示结果。-（不工作/我不确定如何实现它）。C. 例如：我第一次通过在 fields.html 的 x 和 y 文本框中输入值得到了一个结果集。第二次，我在 X 和 Y 文本框中输入不同的值，并在同一个字段中获取 resultset2（resultset2 替换了 resultset1）。现在，如果它按下后退按钮，我应该得到 reslutset1。简单的说，

问题：

  1. 刷新按钮无法正常工作。当我按下刷新按钮时，已经显示的结果与在文本框中输入的值一起消失了。（我不希望这种情况发生在 A 点中提到）
  2. 此外，在获得结果集后，如果我在 X 和 Y 文本框中输入新值，并且如果我按下提交按钮，则没有任何反应。-（不工作）
  3. 另外，我需要后退按钮才能按预期正常工作。- （不知道如何实现）

代码：

文件.html：

<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
        <title>history plugin demo</title>

        <script type="text/javascript" src="jquery-1.2.3.min.js"></script>
        <script type="text/javascript" src="jquery.history.js"></script>

        <script type="text/javascript">
            var $j = jQuery.noConflict();
            var $ = {};
            // PageLoad function
            // This function is called when:
            // 1. after calling $.historyInit();
            // 2. after calling $.historyLoad();
            // 3. after pushing "Go Back" button of a browser
            function pageload(hash) {
                // hash doesn't contain the first # character.
                if(hash) {
                    // restore ajax loaded state
                    $j("#load").load(hash + ".php" , {X: $j("#ix").val(), Y: $j("#iy").val()});
                } else {
                    // start page
                    $j("#load").empty();
                }
            }

            $j(document).ready(function(){
                // Initialize history plugin.
                // The callback is called at once by present location.hash. 
                $j.history.init(pageload);

                // set onlick event for buttons
                $j("form[@rel='history']").submit(function(){
                    // 
                    var hash = this.action;
                    hash = hash.replace(/^.*#/, '');
                    // moves to a new page. 
                    // pageload is called at once. 
                    $j.history.load(hash);
                    return false;
                });
            });
        </script>
    </head>
    <body>
        Ajax load<BR>
            <form id="myForm" action='#query' method='POST' rel="history">
                X <BR>
                <input type="text" name="X" id="ix"><BR> <BR>
                Y <BR>                            
                <input type="text" name="Y" id="iy" > <BR> <BR>
                <input id= "sub" type="submit" value="Search" align="centre"/>
            </form>
        <hr>
            Loaded html:<BR>
            <div id="load"></div>
        <hr>

    </body>
</html>
4

1 回答 1

0

字段.php

<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
        <title>history plugin demo</title>
    </head>
    <body>
    <?php
        $x = ( !empty( $_REQUEST['X'] ) ? $_REQUEST['X'] : null );
        $y = ( !empty( $_REQUEST['Y'] ) ? $_REQUEST['Y'] : null );
        $a = "{ $x , $y }";
    ?>
        Ajax load<BR>
            <form id="myForm" action='fields.php' method='GET' rel="history">
                X <BR>
                <input type="text" name="X" id="ix" value="<?=$x;?>"><BR> <BR>
                Y <BR>
                <input type="text" name="Y" id="iy" value="<?=$y;?>"> <BR> <BR>
                <input id="sub" type="submit" value="Search" align="centre"/>
            </form>
        <hr>
            Loaded html:<BR>
            <div id="load"><?=$a;?></div>
        <hr>
    </body>
</html>
于 2013-07-23T11:38:06.880 回答