重写以前关于从PHP脚本中访问外部JavaScript函数的PHP / JavaScript问题。
我正在尝试访问JavaScript函数MyJsFnct
,它是来自MyJs.js
PHP脚本的MyPhp.php
JavaScript文件的一部分。
我使用的是Windows7,Internet Explorer 11.0.9600和XAMPP-V3.2.1以及PHP-5.5.9。
我的Web根目录是C:\Apache-Php-MySql\htdocs
。
MyPhp.php
和MyJs.js
位于C:\Apache-Php-MySql\htdocs\My-Php-Scripts
。
以下是MyPhp.php
和MyJs.js
的框架,其中包含JavaScript函数MyJsFnct
。
注意,MyPhp.php
和MyJs.js
是包含数百行代码的非常大的PHP / JavaScript项目的一部分。我将问题缩小到只是不起作用的代码。由于框架代码是一个更大的项目的一部分,我不能只用HTML代码替换PHP代码,或用一个按钮替换链接。我需要找出为什么PHP代码无法访问JavaScript函数。
实际项目来自 PHP和MySQL for Dynamic Web Sites,第4版,Larry Ullman,第11章,“PHP和JavaScript”。
MyPhp.php
<!DOCTYPE html>
<html lang ="en">
<head>
<title>Page-Php-Js</title>
<meta http equiv="content-type" content ="text/html; charset=UTF-8" />
<script type="text/javascript" charset="utf-8" src="MyJs.js"> </script>
</head>
<body>
<?php
print "<a href=\"javascript:MyJsFnct()\">Click</a> to call JS function (MyJsFnct)";
?>
</body>
</html>
MyJs.js
function MyJsFnct() {
/* some code that lets me know that
the JavaScript function has been called */
}
相关问题,有没有办法确定调用了哪个JavaScript函数?
使用调试器(F12开发人员工具)时,PHP页面看起来没有0
错误,警告或消息,但是当我点击JavaScript链接时出现以下错误:'MyJsFnct' is undefined
答案 0 :(得分:4)
这不是你所希望的答案,但是:你做的事情真的错了,这有望帮助你把事情弄得更接近正确。
第一步是了解PHP的运行位置,运行JavaScript的位置以及HTML的外观。
根据您显示的内容,您没有使用实际的PHP代码,因此我们不需要任何类型的<?php ... ?>
标记然后进行字符串转义。任何地方。
你真正需要的是一个普通的index.php文件,它适用于所有意图和目的,只是html:
<!doctype html>
<html lang ="en">
<head>
<title>Page-Php-Js</title>
<meta charset="utf-8">
<script src="MyJs.js"></script>
</head>
<body>
<button onclick="MyJsFnct()">Click</button>
</body>
</html>
这里没有PHP代码,因为你不是使用任何PHP。请求index.php
只需直接通过即可。另请注意,这是正确的HTML5,与您的源不同:<meta>
具有charset属性,您使用的格式为HTML 4.01。如果您说您使用的是HTML 4.01,那会很好,但<!doctype html>
指令明确告诉浏览器“这是HTML5!”。此外,meta
未/>
关闭。 <script>
元素对于javascript不需要type
(css的<style>
元素也不需要)。
您还使用了<a>
,好像它是一个按钮 - 有一个<button>
元素,所以请改用它。如果实际链接到其他资源(URL或#FragmentIdentifier),则仅使用<a>
。如果你不希望它看起来像一个按钮,那就无关紧要了:它是关于语义角色的。如果你可以点击它,让JS做某事,那就是<button>
然后你使用一些CSS使它看起来你需要(包括纯文本。按钮样式只是一些创意背景/前景/边界通过浏览器着色并完全覆盖。)
现在,PHP将在这里做 nothing 。它在服务器上运行,并根据某人的浏览器请求生成您的内容。它被转移 - PHP现在死了。从字面上看,它的进程被终止,服务器现在等待更多的新请求。如果这些是用于PHP文件的,它将再次启动PHP,一旦生成数据请求就会再次死亡。
因此,它发送的页面不再受PHP控制:它现在位于浏览器“客户端”,位于要求提供URL的人的计算机上。这可能是你,在运行PHP的同一台计算机上,但就“控制数据的内容”而言无关紧要:PHP死了,你的浏览器就是数据。现在我们处于HTML + JavaScript领域。
因此,修复JavaScript:不要使用document.write
。这是一个古老的,过时的JS调用,绝对不会做你认为它做的事情。如果您认为它将数据写入页面,那么您可以大吼大叫告诉您使用它的人:这不是它的作用。它实际上做的是将数据泵入活动数据流,如果没有,则为浏览器创建一个新的数据流。这意味着如果您在页面加载后将其称为任何时间,它会擦除整个页面,并启动新的写入流以供浏览器解码。你的页面将会消失。这是一个糟糕的功能,你永远不应该使用它。
(有时候你确实想要使用它。那些时间非常罕见,而且通常非常低,并且几乎总是与浏览器作为文件系统或流解释器一起工作。即便如此通常它也是一个坏的主意)
你真正想要的是DOM操作。所以代替MyJs.js
而不是:
function MyJsFnct() {
document.write ("Now inside JS function (MyJsFnct)</br></br>");
}
你真的想要这个:
function MyJsFnct() {
var p = document.createElement("p");
p.textContent = "This paragraph was written by my JavaScript function";
document.body.appendChild(p);
}
这会以正确的方式构建一个新段落,为其分配一些文本内容(如果没有HTML,不要试图使用innerHTML
。如果有HTML,你可能会在不知不觉中烘焙潜在的利用权利)。然后段落将添加到页面的末尾。完成。
最后,不要使用<br>
元素。这是我们没有非常有用的CSS时的延续,我们需要特殊元素来添加垂直间距。我们现在使用CSS执行此操作,并且<br>
在您需要语义换行符时非常适用。因此,不是在视觉上,而是因为当机器读取器应该看到必须提前终止线路并且无论出于何种原因恢复下一条线路时。在正常情况下,没有这样的原因。