Question

我试图建立一个网站，并且我使用ajax来加载一些内容。问题是，当我点击我的提交按钮时，会加载另一个页面，但是当我回来时，ajax不再被加载。我想让我的页面保持原样。

我知道我可以使用pop state事件来存储数据并使用pushState更改历史记录中的链接，但它不起作用。弹出状态事件仅在我单击按钮时起作用，但在提交表单时不起作用，即使调用了pushState。

这是我的代码**评论

**//On those button click, pop state event work**
**// Those button calls ajax function that print content below**

<div onclick='afficheInformations("Ajax/getInternet.php")' id="boutonServices">
<a class="button" href="#informations" role="button" >
<span>Internet</span>
<div class="icon">
    <div class="fa fa-check"></div>
</div>
</a>
</div>

<div onclick='afficheInformations("Ajax/getTelevision.php")' id="boutonServices">
<a class="button" href="#informations" role="button">
<span>Télévision</span>
<div class="icon">
    <i class="fa fa-remove"></i>
    <i class="fa fa-check"></i>
</div>
</a>
</div>
<div id="features-wrapper">
<div id="future">

//This is the content loaded after the button click, its a select that calls ajax
<center><label style="color:white">Voir votre <a style="color:red"href="Speedtest.php" target="_blank"> vitesse</a> actuelle</label></center>
        <div class="container">
        <div class="row">
        <div class="3u 12u(mobile)">
        <section>
        <table class="table">
      <tr>                                               
    <th class="fontInternet" style="color:white">Vitesse de téléchargement</th>
       </tr>
      <tr>
      <th> 

  <select id="telechargement" onchange="addInternet()">
     <option value="non selectionne">Non selectionné</option>
     <option value="1-9">1-9 Mbits/s</option>
     <option value="10-19">10-19 Mbits/s</option>
     <option value="20-49">20-49 Mbits/s</option>
     <option value="50">50+ Mbits/s</option>
  </select>
        </th>
        </tr>
    </table>

**//Finally this is the final content loaded on my main page
//At end, there is my submit, and there is where I want the onclick to keep 
// my data saved when i come back, as I said, pop state dont work on this...**
<li class="price_block">
<form method="POST" action="Fournisseurs/'.$nom.'.php">
<h3 name="services" value="internet">'.$nom.'</h3>
<div class="price">
<div class="price_figure">
<span class="price_number">$'.$prix.'</span>
    <br>
<span class="price_tenure">par mois</span>
</div>
 </div>
 <ul class="features">
   <li>Technologie<br>'.$tech.'</li>
   <li>Téléchargement<br>'. $telechargementData.' Mb/s</li>
 </ul>
<div class="footer">
<input type="submit" onClick="pushHistorique()" class="action_button" value="Consulter" /></input>
 </form>
 </div>
</li>

这就是我的流行状态功能：

window.onpopstate = function(event) {
alert("popstate");
}

这是我的推送状态函数，在我的sumbit点击时调用：

function pushHistorique(){
history.pushState({informations: window.currentInformation}, "title",window.location.href );
 }

我希望这很清楚，因为你的注意力，我很感激

返回按钮后加载ajax

0 个答案: