如何包括在PHP文件时的javascript结构 [英] How to structure javascript when including another php file

问题描述

我试图建立一个小型Web应用程序，但我不清楚如何在页面的不同部分之间的通信。我会用我特定功能来证明我的问题。

I am attempting to build a small web application but I'm not clear how to communicate between different parts of the page. I will use my specific functionality to demonstrate my question.

我所有的网页都使用一个通用的工具栏。由于该工具栏上的多个页面中使用，它是在其自己的PHP文件，我包括使用

All of my pages use a generic toolbar. Since this toolbar is used on multiple pages, it is in its own PHP file, which I include using

<?php include("../toolbar.php"); ?>

工具栏包含一个登录按钮。单击时，这将打开一个模态登录对话框（在这种情况下，Facebook的登录对话框）。当用户登录时，他或她的名字显示在工具栏上，并在日志中按钮被注销按钮所取代。由于这种行为是相同的，无论用户正在查看哪个页面，我创建了一个文件toolbar.js适当地在记录中显示模式，并更新用户名/按钮。

The toolbar includes a log in button. When clicked, this opens a modal login dialog (in this case the Facebook login dialog). When a user logs in, his or her name is displayed in the toolbar, and the log in button is replaced by a 'logout' button. Since this behavior is the same no matter which page the user is viewing, I created a toolbar.js file to display the log in modal and update the username/button appropriately.

然而，在大多数页面，登录或缩小工具栏需要同时更新主页的内容。我不能保证每一个包括网页toolbar.php会做任何事情时，在日志中的地位变化，但大多数人会。

However, on most pages, logging in or out from the toolbar needs to also update the contents of the main page. I can not guarantee that every page that includes toolbar.php will have to do anything when the log in status changes, but most will.

类似地，反向是可能的 - 某页可能具有工具栏外的登录按钮。当这是所使用的，工具栏需要更新

Similarly, the reverse is possible - a certain page might have a 'log in' button outside the toolbar. When this is used, the toolbar needs to update.

什么是处理这个问题的最佳方式？

What is the best way to handle this?

目前的实现 - 这可能是可怕的......

Current implementation - this might be awful…

在toolbar.js我基本上调用一个函数，'userSignedIn'，每当用户登录（和注销等效）。 toolbar.js，实现这个本身（它需要更新其按钮和用户名标签）。

In toolbar.js I am basically calling a function, 'userSignedIn', whenever the user logs in (and an equivalent for log out). toolbar.js, implements this itself (it needs to update its button and user name label).

之后，如果主网页（可以称之为mainPage.php）需要额外的东西，我是'上钉'的附加动作相同功能，使用重。在该网页的加载，我做到以下几点：

Then, if the main page (lets call it mainPage.php) needs to anything additional, I am re-using this same function to 'tack on' the additional actions. On load of that page, I do the following:

var originalUserSignedIn = userSignedIn;
userSignedIn = function() {
    originalUserSignedIn();
    customUserSignedIn();
}

customUserSignedIn距离mainPage.js，我在那里执行其他操作的功能。我还没有实现的相反（登录从mainPage.php需要更新toolbar.php）的解决方案。

customUserSignedIn is a function within mainPage.js, where I perform the additional actions. I have not yet implemented a solution for the opposite (sign in from mainPage.php needs to update toolbar.php).

我猜从一个Objective-C背景的，我试图东西类似于一个方法实现调用超级。

I guess coming from an objective-C background, I am attempting something analogous to calling 'super' in a method implementation.

推荐答案

要做到这一点是初始化一个空数组来保存回调函数和符号函数来调用它们，之前的任何其他JavaScript的方法之一：

One way to do it is to initialize an empty array to hold callback functions and the sign function to call them, before any of the other javascript:

var userSignedInCallbacks = [];

var userSignedIn = function() {
    for (var i = 0; i < userSignedInCallbacks.length; i++) {
        userSignedInCallbacks[i]();
    }
}

然后，工具栏和主页JS都将只是增加其相应的回调数组：

Then, toolbar and main page js will both just add their appropriate callbacks to the array:

userSignedInCallbacks.push(function() {
    // ...
});

最后，无论是工具栏或主页中登录的操作都将只是调用 userSignedIn（）。

这篇关于如何包括在PHP文件时的javascript结构的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！