爲什麼從javascript到另一個javascript未定義的eror？

我A.html + A.js，B.html + B.js爲什麼從javascript到另一個javascript未定義的eror？

和A.html

<div class="navbar"> 
    <img class="img_1" href="http://blaaaa.jpg"> 
    <a class="button">OK</a> 
</div>

和A.js

var img_src; 
    $(document).ready(function() { 

    $(document).on('click', '.button', function() { 
    var img_set = document.getElementById('img_1'); 
    img_src = img_set.src; 
    console.log("1: "+img_src); // successfully print. 
    location.href = "B.html"; 

});

和B.html

<div> 
    <img class="img_2"> 
</div>

和B.js

$(document).ready(function() { 
    $('.img_2').attr("src",img_src); // not set image 
    console.log("2: "+img_src); // undefined error... 
});

我如何知道問題是否發生？

我設置頭兩個劇本，但它也出現錯誤..

<script type='text/javascript' src="js/A.js"></script> 
<script type='text/javascript' src="js/B.js"></script>

或

<script type='text/javascript' src="js/B.js"></script> 
<script type='text/javascript' src="js/A.js"></script>

來源

2017-07-11 ko_ma

請告訴我的錯誤？向我們顯示錯誤消息。 –

@ko_ma我在'B.html'中的'img'標籤上看不到'src'屬性。 –

您已經「打開」了一個清除javascript內存的新頁面。在那裏，你不會傳遞'img_src'內容。因此它在'B.html' – KarelG

所以不是添加兩個分隔符的JS，你可以添加一個與localStorage的發揮。你可以在這裏閱讀https://www.w3schools.com/html/html5_webstorage.asp

$(document).on('click', '.button', function() { 
 
    if ($('#img_1').length) { 
 
    var img_set = $('#img_1'); 
 
    localStorage.setItem('img_src', img_set.src); 
 
    console.log("1: " + img_set.src); 
 
    location.href = "B.html"; 
 
    } 
 
}); 
 

 
$(document).ready(function() { 
 
    if ($('.img_2').length) { 
 
    $('.img_2').attr("src", localStorage.getItem('img_src')); 
 
    } 
 
});

更多的localStorage基本上，你應該檢查DOM元素存在，或不使用length。

來源

2017-07-11 08:06:52

我加了長度，但是發生'2： undefined'too ... –

That;寫在B.js的'console.log'中。你需要定義'img_src'變量。它應該有一定的價值。 –

我對本地應用程序太困惑了。感謝您的幫助。 –

這裏img_src不是全球 variable.You是沒有定義img_src在B.js中，並嘗試使用這就是爲什麼它給錯誤。剛剛宣佈在B.js
的img_src這樣

var img_src; 
$(document).ready(function() { 
    $('.img_2').attr("src",img_src); // not set image 
    console.log("2: "+img_src); // undefined error... 
});

而且

來源

2017-07-11 08:06:23

你必須明白每個頁面都有自己的javascript內存。如果兩個頁面都在自己的實體上，則一個頁面不能訪問另一個頁面的內存內容。（此例外是，但即使如此，這也很複雜）。

假設您有兩個頁面：頁面1和頁面2.在頁面1中，您有var value=11;和第2頁var value=22;。他們有相同的名字，但他們沒有訪問對方。如果您在第1頁中使用value，則會得到11.不是22.同樣，在第2頁中，您將得到22而不是11.如果僅在第1頁中執行value = value + 100，則第1頁中的value爲111.頁面中的value 2仍然是22.因此，頁面上的一個腳本無法訪問另一個頁面上的另一個腳本。（如果你允許這樣做，那麼存在巨大的安全風險......）

有了這些知識，我們來看看你的例子。

在開始時，您已經加載了A.html，它執行以下腳本。

var img_src; 
$(document).ready(function() { 

    $(document).on('click', '.button', function() { 
    var img_set = document.getElementById('img_1'); 
    img_src = img_set.src; 
    console.log("1: "+img_src); // successfully print. 
    location.href = "B.html"; 

});

如果您點擊該按鈕，它會在點擊處理程序中執行上述語句。我在下面添加了註釋，以解釋發生了什麼。

var img_set = document.getElementById('img_1'); // get the image by id "img_1" 
img_src = img_set.src; // variable img_src is now set with the given source 
console.log("1: "+img_src); // prints the source 
location.href = "B.html"; // load the page to B.html

在腳本期間，變量img_src包含信息。但最後，你正在啓動一個加載請求，到B.html這是一個不同的頁面與他們自己的內存。當B.html被加載時，該腳本執行

$(document).ready(function() { 
    $('.img_2').attr("src",img_src); // not set image 
    console.log("2: "+img_src); // undefined error... 
});

更特別

$('.img_2').attr("src",img_src)

你想在這裏做的是設置與img_src保持信息的圖像元素的來源。但如前所述，您已重新加載該頁面，該頁面爲該頁面創建了一個新的內存。這裏，在這個存儲器中，img_src未被聲明（和初始化）。您正嘗試從尚未被內存識別的變量中獲取信息。

要解決它，你必須有一個有效的變量，它被聲明和初始化。這可以由路過的img_src從A.js的內容B.js完成通過將其作爲URL參數，本地存儲，...

來源

2017-07-11 08:21:37 KarelG

我太困惑與本機應用程序。感謝您的幫助。 –

爲什麼從javascript到另一個javascript未定義的eror？

回答

相關問題