document.location后续代码制定

你好可爱的人StackOverflow。document.location后续代码制定

我想创建一个使用JavaScript AJAX和PHP的动态页面。

我已经创建了一个图像列表，其中有唯一的ID号码1-12。当点击它时，它应该将该ID传递给改变页面的函数，然后使用该ID号将内容加载到新页面。

我的问题是，当我使用document.location更改页面（或window.assign）时，它不会更改页面，然后才会执行下面的代码，该代码将在内容中加载。因此它会尝试将内容加载到当前页面上不存在的div，然后更改该页面。有人知道这是为什么吗？我该如何解决它？

我已经尝试将document.location和innerHTML代码放在单独的函数中，但下一个函数在页面更改前仍然调用。我也尝试在内容加载之前放置if语句，但在页面更改之前也会调用它。

这里是我的代码：

function output (bookList){ 
     for (var i = 0; i < titles.length; i++) { 
     document.getElementById("insertBooksHere").innerHTML += "<ul class=\"bookItem\">"; 
      for (var t = 0; t<position.length; t++){ 

       if (t==position.length-1) 
         { 
          x = bookList[i][0]; 
          document.getElementById("insertBooksHere").innerHTML += "<img class=\'books\' id = \'" + x + "\' src=\'" +bookList[i][t]+ "\' onClick=\'getBookDetails("+ x +")\'>"; 
         } 
         else 
       if (t == 1 || t==2){ 
         document.getElementById("insertBooksHere").innerHTML += "<li>"+bookList[i][t]+"</li>"; 
         } 
      } 
     document.getElementById("insertBooksHere").innerHTML += "</ul></div>"; 
    } 
    } 


    function getBookDetails(id){ 
     bookID = id;  
     for (var t = 0; t<12; t++) 
     { 
     bookDetails[t] = bookList[bookID-1][t];//grab details about specified book from array using x as the value for i. 
     } 
     loadBookPage(bookID, bookDetails) 
    } 


function loadBookPage(bookID, bookDetails){ 
    console.log(window.location.href); 
} 


function loadBookDetails(){ 
if (document.location == 'books/'+bookID+'.php') 
{ 
     x = bookID; 
    console.log(bookDetails); 
     document.getElementById("book").innerHTML += "<ul class=\"bookItem\">"; 

     for (var t = 0; t<position.length; t++){ 

      if (t==position.length-1) 
        { 
         document.getElementById("book").innerHTML += "<img class=\'books\' id = \'" + x + "\' src=\'" +bookDetails[t]+ "\'>"; 

        } 
        else { 
        document.getElementById("book").innerHTML += "<li>"+bookDetails[t]+"</li>"; 
        console.log("for loop"); 
        } 
     console.log(bookDetails[t]); 
     } 
    document.getElementById("book").innerHTML += "</ul>"; 
    document.getElementById("book").innerHTML += "HELLO!!!"; 
    } 
}

而且你可以在这里看到我的工作：http://itsuite.it.brighton.ac.uk/rlr17/bookClub/home.php

谢谢你们！非常感谢您的帮助。

来源

2016-03-21 rushlet

我的问题是，当我使用document.location更改页面（或window.assign）时，它不会更改页面，然后执行下面加载内容的代码。

这就是JavaScript（当运行客户端时，嵌入在网页中）的工作原理。

它在该页面中运行。

如果页面消失（因为您加载了新页面），那么它的执行环境就会消失并停止运行。

如果你想要做的事在未来页面，那么你必须通过一些数据到该页面，并在新的页面有代码读取数据，并采取行动。

理想情况下，您可以使用服务器端代码（如it is more reliable，并且在加载新页面时很少有运行时成本）。

来源

2016-03-21 16:27:02 Quentin

哦所以使用PHP POST将变量发送到下一页？当然！谢谢你快速的回复：） – rushlet

document.location后续代码制定

回答

相关问题