从另一个文件获取 Javascript 变量或值

Question

我有一个文件./js/onload.js ，里面有这段代码。

$('#fb5-book').turn({
                display: DISPLAY,
                duration: 600,
                acceleration: true,
                elevation: 50,
                page: nrPage,
                when: {
                    first: function (e, page) {
                        $('.fb5-nav-arrow.prev').hide();
                    },

                    turned: function (e, page) {

                        Book_v5.currentPage = page;  //Do not delete this, other function use this.
                        
                        if (page > 1) {
                            $('.fb5-nav-arrow.prev').fadeIn();
                            //$('#fb5-about').hide();
                        }

                        if ((page == 1 && RTL == 'false') || (page == $(this).turn('pages') && RTL == 'true')) {
                            $('#fb5-about').css('z-index', 11);
                        }

                        if (page < $(this).turn('pages')) {
                            $('.fb5-nav-arrow.next').fadeIn();
                        }

在Book_v5.currentPage = page; 如果我添加alert(page)或console.log(page)我可以在控制台中获取警报和数据。

我有一个 index.php 文件。 因为我想创建一个变量let pageNumber=1并且 pageNumber 的值将根据./js/onload.js中的page值更改 我该怎么做？

我在./js/onload.js中试过这个

let pageNumber=page;

在<script>标签内的index.php中，我尝试调用pageNumber它不起作用。 我是 JS 的新手。

Answer 1

有几种方法可以在 JavaScript 文件之间共享页面变量的值。 这里有三个选项：

您可以使用全局变量。 在./js/onload.js中，可以这样定义一个全局变量：

window.pageNumber = page;

然后，在 index.php 中，您可以像这样访问 pageNumber 的值：

让 pageNumber = window.pageNumber; 您可以使用 window.postMessage 方法。 在./js/onload.js中，可以这样给父window发送消息：

window.parent.postMessage(page, '*');

然后，在 index.php 中，您可以像这样收听来自子 window 的消息：

window.addEventListener('message', function(event) {
  let pageNumber = event.data;
});

您可以使用像 PubSubJS 这样的库来发布和订阅事件。 在./js/onload.js中，你可以这样发布一个事件：

PubSub.publish('pageNumber', page);

然后，在 index.php 中，你可以这样订阅事件：

PubSub.subscribe('pageNumber', function(msg, pageNumber) {
  console.log(pageNumber);
});

Answer 2

最后，我找到了答案。

内部index.php

<script>
let pageNumber = 1;

function updatePageNumber(newPageNumber) {
  pageNumber = newPageNumber;
}
</script>

在onload.js里面我添加了 function

turned: function (e, page) {
  // other code here
  updatePageNumber(page);
}