Javascript-如何让脚本与Ajax请求的数据一起运行

Javascript - How to get script to run with Ajax requested data

本文关键字:请求 数据 一起 运行 Ajax 脚本 Javascript-      更新时间:2023-09-26

战场页面

在上图中,有一个页面上有一个有20个用户的战场。我写了JavaScript来捕获数据并将其存储在MySQL数据库中。当我需要点击下一页进入下一页并收集数据时,问题就出现了。

它通过Ajax调用获取接下来的20个用户。显然,当这种情况发生时,脚本无法记录新信息,因为页面从不在Ajax调用上加载,这意味着脚本不会执行。有没有一种方法可以在单击Ajax链接时强制加载页面?

这是代码:

grabData();var nav=document.getElementsByClassName('nav')[0]。getElementsByTagName('td')[2]。getElements By TagName('aa')[0];

 nav.addEventListener("click", function(){
      grabData();
  });
  function grabData(){
      var rows = document.getElementsByClassName('table_lines battlefield')[0].rows;
      var sendData = '';
      for(i=1; i < rows.length -1 ; i++){
          var getSid = document.getElementsByClassName('table_lines battlefield')[0].getElementsByTagName('tr')[i].getElementsByTagName('td')[2].getElementsByTagName('a')[0].href; 
          var statsID = getSid.substr(getSid.indexOf("=") + 1); //Grabs ID out of stats link
          var name = document.getElementsByClassName('table_lines battlefield')[0].getElementsByTagName('tr')[i].getElementsByTagName('td')[2].textContent.replace(/',/g,"");
          var tff = document.getElementsByClassName('table_lines battlefield')[0].getElementsByTagName('tr')[i].getElementsByTagName('td')[3].textContent.replace(/',/g,"");
          var rank = document.getElementsByClassName('table_lines battlefield')[0].getElementsByTagName('tr')[i].getElementsByTagName('td')[6].textContent.replace(/',/g,"");
          var alliance = document.getElementsByClassName('table_lines battlefield')[0].getElementsByTagName('tr')[i].getElementsByTagName('td')[1].textContent.trim();
          var gold = document.getElementsByClassName('table_lines battlefield')[0].getElementsByTagName('tr')[i].getElementsByTagName('td')[5].textContent.replace(/',/g,"");
          if(alliance == ''){
              alliance = 'None';
          }
          if(gold == '??? Gold'){
              gold = 0;
          }else{
              gold = gold.replace(/[^'/'d]/g,'');
          }
          sendData += statsID + "=" + name + "=" + tff + "=" + rank + "=" + alliance + "=" + gold + "@";
      }
      $.ajax({
          // you can use post and get:
          type: "POST",
          // your url
          url: "url",
          // your arguments
          data: {sendData : sendData},
          // callback for a server message:
          success: function( msg ){
              //alert(msg);
          },
          // callback for a server error message or a ajax error
          error: function( msg )
          {
              alert( "Data was not saved: " + msg );
          }
      });
  }

如上所述,这将获取信息并发送到后端的php文件。所以当我在战场页面上点击next时,我需要能够再次执行这个脚本。

更新:问题已解决。我可以通过在DOM树中向下钻取,直到找到"下一个"锚标记来实现这一点。我只是添加了一个事件侦听器,用于每当单击它时,并让它重新执行JavaScript。

是的,您可以强制页面加载,因此:

window.location.reload(true);

然而,AJAX的目的是不重新加载页面,因此您必须经常编写javascript代码,以复制最初构建页面的服务器端代码。

但是,如果讨论中的页面加载代码在页面加载时以javascript运行,那么您可以将其转换为一个函数,并在AJAX成功函数中重新调用该函数。

参考:

如何使用jQuery刷新页面?