php - 重新访问同一链接后如何将文本放置在其原始空间？

Question

我的问题听起来有点混乱。让我详细解释一下我的要求是什么。我正在使用 php、smarty、ajax 和 jquery。我正在输入一个网址并将查询字符串中的一个值传递给页面，如下所示：

http://localhost/schooling_needs/sneeds1.0/web/teacher_details.php?teacher_id=5ed39ad1bce91ebc071f859cc76dea66

然后加载以下页面（附上屏幕截图）。在此处输入图像描述

然后如果单击任何类名，它的主题就会显示出来，我使用 jquery 的 ajax() 方法来实现这一点。然后，如果我单击任何主题，则会显示该主题的章节，为此我还使用了 ajax()。它看起来像在附加的屏幕截图中。在此处输入图像描述

现在，当我单击章节列表中的任何章节时，页面将重定向到下一页。我以查询字符串的形式通过超链接传递了几个值（您将从代码中了解这些值）。然后新页面将显示在此屏幕截图中。在此处输入图像描述

现在从这里开始，当我应该单击返回链接时，我的问题就开始了，当我单击主题章节时，它应该看起来像每件事一样，但实际上它的外观附在这个在此处输入图像描述屏幕截图中。实际上它应该像屏幕截图2一样显示

正如您从屏幕截图中看到的，内容显示在左角。发生这种情况是因为我首先通过后续请求使用 ajax，但是当我单击返回链接时，ajax 没有被调用，因此它没有显示在正确的位置。供您参考，我提供了我的 PHP 文件以及 smarty 模板文件的代码：

教师详细信息.php

<?php  
  require_once("includes/public-application-header.php");

  ob_start();
  prepare_request();
  $request = empty( $_GET ) ? $_POST : $_GET ;
  $op = $request['op']; 
  $objTeacherDetails = new TeacherDetails();
  if (isset($_GET['teacher_id'])){
            $teacher_id = $_GET['teacher_id'];
        $_SESSION['teacher_id'] = $teacher_id;
        } elseif (isset($_SESSION['teacher_id'])) {
            $teacher_id = $_SESSION['teacher_id'];
    }
    $teacher_classes = $objTeacherDetails->GetAllClassesByTeacherId($teacher_id);
    $smarty->assign('teacher_classes', $teacher_classes);
  $file_to_show = "teacher-details.tpl";

switch( $op ) {
    case "get_assigned_subject_list":
        $objClassSubjects = new ClassSubjects();
        $objSubjects = new Subjects();
        $class_id  = $request['class_id'];
        $all_subjects = $objSubjects->GetAllSubjects();
        $subject_details = $objClassSubjects-> GetClassSubjectDetailsById($class_id);

        $smarty->assign('all_subjects', $all_subjects);
        $smarty->assign('subject_details', $subject_details);
        $smarty->assign('teacher_id', $teacher_id); 
        $smarty->assign('class_id', $class_id);
        $smarty->display("assigned-subject-list.tpl");

        die();
        break;

  case "get_subject_chapter_list":
        $objChapters = new AdminChapters();
        $cs_map_id   = $request['cs_map_id'];
        $class_id = $request['class_id'];
        $chapter_details = $objChapters->GetAllChaptersBycsmapId($cs_map_id);

        $smarty->assign('class_id', $class_id);
        $smarty->assign('teacher_id', $teacher_id);
        $smarty->assign('cs_map_id', $cs_map_id);
        $smarty->assign('chapter_details', $chapter_details);   
        $smarty->display("chapter-by-subject.tpl");

        die();
        break;

        case "back":
        $objClassSubjects = new ClassSubjects();
        $objSubjects = new Subjects();
        $objChapters = new AdminChapters();

        $teacher_id  = $request['teacher_id'];
        $class_id  = $request['class_id'];
        $cs_map_id  = $request['cs_map_id'];

        $all_subjects = $objSubjects->GetAllSubjects();
        $subject_details = $objClassSubjects-> GetClassSubjectDetailsById($class_id);
        $chapter_details = $objChapters->GetAllChaptersBycsmapId($cs_map_id);


        $smarty->assign('all_subjects', $all_subjects);
        $smarty->assign('subject_details', $subject_details);
        $smarty->assign('teacher_id', $teacher_id); 
        $smarty->assign('class_id', $class_id);
        $smarty->display("assigned-subject-list.tpl");
        $smarty->assign('class_id', $class_id);
        $smarty->assign('teacher_id', $teacher_id);
        $smarty->assign('cs_map_id', $cs_map_id);
        $smarty->assign('chapter_details', $chapter_details);   
        $smarty->display("chapter-by-subject.tpl");
        //die();
        //break;

}

  $smarty->assign("file_to_show", $file_to_show);
  $smarty->display("index.tpl");    

?>

class_details.php

<?php 
  require_once("includes/public-application-header.php");
  ob_start();
  prepare_request();
  $request = empty( $_GET ) ? $_POST : $_GET ; 
  $class_id = $request['class_id'];
  $teacher_id = $request['teacher_id'];
  $cs_map_id = $request['cs_map_id'];
  $chapter_id = $request['chapter_id'];

  $op = $request['op'];

  switch( $op ) {
    case "get_chapter_theory":
      $objChapters = new AdminChapters();
      $chapter_theory_details = $objChapters->GetChapterDetailsByID($chapter_id);

      $smarty->assign('class_id', $class_id);
      $smarty->assign('teacher_id', $teacher_id);
      $smarty->assign('cs_map_id', $cs_map_id); 
      $smarty->assign('chapter_theory_details', $chapter_theory_details); 
      $smarty->display("chapter-theory-by-chapter.tpl");

      die();
      break;

    case "get_chapter_questions":
      $objChapterQuestions = new ChapterQuestions();
      $chapter_questions = $objChapterQuestions->GetChapterQuestionByChapterID($chapter_id);

      $smarty->assign('chapter_questions', $chapter_questions); 
      $smarty->display("chapter-questions-by-chapter.tpl");

      die();
      break;

    case "get_chapter_ppts":
      $objChapterPpts = new ChapterPpts();
      $chapter_ppts =  $objChapterPpts->GetChapterPptsByPptChapterID($chapter_id);

      $smarty->assign('chapter_ppts', $chapter_ppts); 
      $smarty->display("chapter-ppts-by-chapter.tpl");

      die();
      break;

    case "get_chapter_mcqs":
      $objChapterMcqQuestions = new ChapterMcqQuestions();
      $chapter_mcqs =  $objChapterMcqQuestions->GetChapterMcqQuestionsByChapterID($chapter_id);

      $smarty->assign('chapter_mcqs', $chapter_mcqs); 
      $smarty->display("chapter-mcqs-by-chapter.tpl");

      die();
      break;

    case "get_chapter_yvideos":
      $objChapterYoutubeVideos = new ChapterYoutubeVideos();
      $chapter_yvideos =  $objChapterYoutubeVideos->GetYoutubeVideoByChapterID($chapter_id);

      $smarty->assign('chapter_yvideos', $chapter_yvideos); 
      $smarty->display("chapter-yvideos-by-chapter.tpl");

      die();
      break;
  }
    ?>

教师详细信息.tpl

{literal}
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script type="text/javascript">
function get_subjects_by_class(class_id) { 
    $.ajax({
                url: "teacher_details.php",
          type: "POST",
                data: {'request_type':'ajax', 'op':'get_assigned_subject_list', 'class_id':class_id},  
                success: function(data) {
                $('#subject_container').html(data);
            }
    });
}
</script>
{/literal}
<table width="100%" border="0" align="center" cellpadding="0" cellspacing="0" >
    <tr>
        <td align="left" valign="top">
          <h3>Teacher Details</h3>
        </td>
    </tr>
</table>
<table width="99%" border="0" cellpadding="0" cellspacing="0" class="manage_box" >
    <tr>
      <td>
        <form>
                <table>
          <tr>
            <td align="center">
            {if $teacher_classes}
            Classes
            </td>   
            {if $teacher_classes}
            {foreach from=$teacher_classes item="class"}
          </tr>
          <tr>
            <td valign="top" align="center" width="20">
              <a href="#" onClick="get_subjects_by_class({$class.class_id}); return false;">{$class.class_name}</a>
            </td>
            {/foreach}
            {/if}
          </tr>
            {/if}
        </table>
            </form>                     
        </td>
    <td align="left" id="subject_container" valign="top">
    </td>
    <td align="left" id="chapter_container" valign="top">
    </td>
  </tr>
</table>

分配的主题列表.tpl

{literal}
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script type="text/javascript">
function get_chapters_by_subject(cs_map_id,class_id) { 
  $.ajax({
          url: "teacher_details.php",
          type: "POST",
          data: {'request_type':'ajax', 'op':'get_subject_chapter_list', 'cs_map_id':cs_map_id, 'class_id':class_id},  
          success: function(data) {
            $('#chapter_container').html(data);
        }
    });
}
</script>
{/literal}
<form>
  <table cellpadding="0" cellspacing="0" border="0">
    <tr>
      <td align="center">
      {if $subject_details}  
      Subjects
      </td>
      {foreach from=$all_subjects item=subjects}
    </tr>
    <tr>
      <td align="center" valign="top" width="150">
      {foreach from=$subject_details item=subject} 
      {if $subject.cs_subject_id==$subjects.subject_id}<a href="#" onClick="get_chapters_by_subject({$subject.cs_map_id},{$class_id}); return false;">{$subjects.subject_name}</a>{/if}
      {/foreach}
      </td>
      {/foreach}
    </tr>
      {/if}
  </table>
</form>

逐章主题.tpl

<form>
  <table cellpadding="0" cellspacing="0" border="0">
    <tr>
      <td align="center">
      {if $chapter_details}  
      Chapters
      </td>
    </tr>
    {foreach from=$chapter_details item=chapter} 
    <tr>
      <td align="center" valign="top" width="150">
      <a href="{$site_url}chapter_details.php?class_id={$class_id}&teacher_id={$teacher_id}&cs_map_id={$cs_map_id}&chapter_id={$chapter.chapter_id}&op=get_chapter_theory" title="Chapter's Theory">{$chapter.chapter_title}</a>
      </td>      
    </tr>
    {/foreach}
      {/if}
  </table>
</form>

逐章理论.tpl

{literal}
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script type="text/javascript">
function get_chapter_details(op,chapter_id) { 
  $.ajax({
          url: "chapter_details.php",
          type: "POST",
          data: {'request_type':'ajax', 'op':op, 'chapter_id':chapter_id},  
          success: function(data) {
            $('#chaper_data_container').html(data);
        }
    });
}
</script>
{/literal}
<form>
  <table cellpadding="0" cellspacing="0" border="0"> 
    <tr>
      <td align="center" colspan="5">
      {if $chapter_theory_details}  
      <h2>Chapter's Theory</h2>
      </td>
    </tr>
    <tr>
      <td align="center">
      <b><a href="#" onClick="get_chapter_details('get_chapter_questions',{$chapter_theory_details.chapter_id}); return false;">Chapter Questions</a></b>&nbsp;&nbsp;
      </td>
      <td align="center">
      <b><a href="#" onClick="get_chapter_details('get_chapter_ppts',{$chapter_theory_details.chapter_id}); return false;">Chapter PPTs</a></b>&nbsp;&nbsp;
      </td>
      <td align="center">
      <b><a href="#" onClick="get_chapter_details('get_chapter_mcqs',{$chapter_theory_details.chapter_id}); return false;">Chapter MCQs</a></b>&nbsp;&nbsp;
      </td>
      <td align="center">
      <b><a href="#" onClick="get_chapter_details('get_chapter_yvideos',{$chapter_theory_details.chapter_id}); return false;">Chapter Youtube Videos</a></b>&nbsp;&nbsp;
      </td>
      <td align="center">
      <b><a href="{$site_url}teacher_details.php?class_id={$class_id}&teacher_id={$teacher_id}&cs_map_id={$cs_map_id}&op=back" title="Chapter's Theory">
      Back</a></b>&nbsp;&nbsp;
      </td>
    </tr>
    <tr>
      <td  align="center" valign="top" colspan="5">
      {$chapter_theory_details.chapter_data}
      </td>      
    </tr>
      {/if}
  </table>
    <div id="chaper_data_container">
    </div>
</form>

现在任何人都可以在单击后退按钮后帮助我将问题放在适当的位置吗？提前致谢。

score 1 · Accepted Answer

您的问题是 AJAX 响应没有保留在历史堆栈中。您可以通过多种方式解决此问题。但首先请阅读这里的讨论。

按照答案之一的建议使用 html5 history api 或 html5 local storage
使用简单的基于哈希的解决方案。为此，请使用简单的哈希历史插件或编写您自己的代码。

编辑：有很好的演示（连同片段）与 AJAX 内容。看到这个和这个。

php - 重新访问同一链接后如何将文本放置在其原始空间？

1 回答 1

Related

Reference