PHP + JQuery - 如何一起使用这两者？请看我的例子
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/9347966/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
PHP + JQuery - How to use these two together? Please see my example
提问by Craig van Tonder
I have a php based website. As in, all of the pages html is output via php.
我有一个基于 php 的网站。就像在，所有页面 html 都是通过 php 输出的。
Here is a simple example:
这是一个简单的例子：
<?php
ob_start();
$pageStart = '
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>MY WEBSITE PAGE</title>
</head>
<body>
<p>CONTENT</p>
</body>
</html>
';
echo $pageStart;
exit;
?>
What i would like to do is make use of some jquery in this page.
我想做的是在此页面中使用一些 jquery。
So naturally my first attempt was to include the script inside of the php variable like so:
所以很自然地，我的第一次尝试是将脚本包含在 php 变量中，如下所示：
<?php
ob_start();
$pageStart = '
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script type="text/javascript">
var datefield=document.createElement("input")
datefield.setAttribute("type", "date")
if (datefield.type!="date"){ //if browser doesn't support input type="date", load files for jQuery UI Date Picker
document.write('<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css" rel="stylesheet" type="text/css" />\n')
document.write('<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"><\/script>\n')
document.write('<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"><\/script>\n')
}
</script>
<script type="text/javascript">
if (datefield.type!="date"){ //if browser doesn't support input type="date", initialize date picker widget:
jQuery(function($){ //on document.ready
$('#birthday').datepicker();
})
}
</script>
</head>
<body>
<p>CONTENT</p>
</body>
</html>
';
echo $pageStart;
exit;
?>
Now, I use dreamweavers code editor, which due to the syntax highlighting feature, will point out the masses of syntax errors produced in this.
现在，我使用 Dreamweavers 代码编辑器，由于具有语法高亮功能，它会指出由此产生的大量语法错误。
So i at first attempted to slash out these errors. This failed.
所以我首先试图消除这些错误。这失败了。
So i tried changing the "s to 's, and visa versa, until the errors were gone. This failed too as it seems the script will not validate in this manner.
所以我尝试将 "s 更改为 s，反之亦然，直到错误消失。这也失败了，因为脚本似乎不会以这种方式验证。
So i read a few tutorials, and found this one:
所以我阅读了一些教程，并找到了这个：
JavaScript 和 PHP 都可能为任何 Web 开发工作带来巨大的潜力，但它们并不总是能很好地配合使用。阅读有关问题。
And the way I understand it, is that you'd need to include the js rather than have it as part of your php directly.
我理解它的方式是，您需要包含 js 而不是直接将其作为 php 的一部分。
So have a file called page.php and another called jquery.php. So I decided to try and modify this idea to suite my problem.
所以有一个名为 page.php 的文件和另一个名为 jquery.php 的文件。所以我决定尝试修改这个想法来解决我的问题。
So i started with something like this - index.php:
所以我从这样的事情开始 - index.php：
<?php
ob_start();
$pageStart = '
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>MY WEBSITE PAGE</title>
'. include $_SERVER['DOCUMENT_ROOT'] . '/../../path/to/include/datepicker.php'.'
</head>
<body>
<p>CONTENT</p>
</body>
</html>
';
echo $pageStart;
exit;
?>
And - datepicker.php:
和 - datepicker.php：
<script language="Javascript">
var datefield=document.createElement("input")
datefield.setAttribute("type", "date")
if (datefield.type!="date"){ //if browser doesn't support input type="date", load files for jQuery UI Date Picker
document.write('<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css" rel="stylesheet" type="text/css" />\n')
document.write('<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"><\/script>\n')
document.write('<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"><\/script>\n')
}
</script>
<script language="Javascript">
if (datefield.type!="date"){ //if browser doesn't support input type="date", initialize date picker widget:
jQuery(function($){ //on document.ready
$('#birthday').datepicker();
})
}
</script>
Now there are no syntax errors in either page, great... So I try it, half expecting things to finally just work...
现在任何一页都没有语法错误，太好了......所以我尝试了它，一半期待事情最终能正常工作......
Nope... Fatal Error: failed to open stream: No such file or directory blah blah. This error relates to the include that i added. So okay, even though the file is there, it is not being validated as php because there are no opening and closing php tags.
不...致命错误：无法打开流：没有这样的文件或目录等等。此错误与我添加的包含有关。好吧，即使文件在那里，它也不会被验证为 php，因为没有打开和关闭 php 标签。
So I add them... Annnd... A page full of syntax errors again!
所以我添加它们... Annnd... 又是一个充满语法错误的页面！
So my question is this:
所以我的问题是：
Could some please share some knowledge and explain to me roughly how this process actually works. Whats the deal with all the syntax errors, and how are you supposed to go about a task like this?
请一些人分享一些知识并向我大致解释一下这个过程是如何工作的。怎么处理所有的语法错误，你应该如何处理这样的任务？
I believe it is possible, and yes it would ceratinly be easier if i was not outputting the entire html via php. But this is a simple example and my actual design is alot more complex. It requires for the different parts of the page to be broken up into variables, in order to place those bits and peices when needed, dynamically.
我相信这是可能的，是的，如果我不通过 php 输出整个 html，那肯定会更容易。但这是一个简单的例子，我的实际设计要复杂得多。它需要将页面的不同部分分解为变量，以便在需要时动态地放置这些点点滴滴。
Any input, suggestions, or insight would be greatly appreciated; and any links to pages or tutorials that cover this would also be greatly appreciated.
任何输入、建议或见解将不胜感激；以及任何指向涵盖此内容的页面或教程的链接也将不胜感激。
Thank You!!
谢谢你！！
回答by Ray Perea
All you need to do to use jQuery with PHP is to include the jQuery javascript file in your HTML document in the head tag. I actually use PHP along with jQuery all the time. And this is how I do it. In your code above, it looks like you have some escaping issues with your code. And it also looks like you want to hold the header of the page in a PHP variable then print it out. You don't have to do all that. Just put the plain text in your PHP file without any php tags and it will work. Also, you are using an old version of jQuery. Should probably use the latest version. But, if you need it stored in a PHP variable so that you can print it out, do this:
在 PHP 中使用 jQuery 所需要做的就是在 HTML 文档的 head 标记中包含 jQuery javascript 文件。我实际上一直在使用 PHP 和 jQuery。这就是我的做法。在上面的代码中，您的代码似乎存在一些问题。而且看起来您希望将页面的标题保存在 PHP 变量中，然后将其打印出来。你不必做这一切。只需将纯文本放在您的 PHP 文件中，不带任何 php 标签，它就会起作用。此外，您使用的是旧版本的 jQuery。应该使用最新版本。但是，如果您需要将其存储在 PHP 变量中以便您可以将其打印出来，请执行以下操作：
SO, here is some code to get you started.
所以，这里有一些代码可以帮助您入门。
<?php
$pageStart = '<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>MY WEBSITE PAGE</title>
<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.17/themes/base/jquery-ui.css" rel="stylesheet" type="text/css" />
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.17/jquery-ui.min.js"></script>
<script type="text/javascript">
$(document).ready(function(e) {
$("#date").datepicker();
});
</script>
</head>
<body>
<input type="text" id="date" name="date" />
</body>
</html>';
print $pageStart;
?>
回答by elrado
<head>
<script type="text/javascript"
src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
// javascript & jquery code
// even better would be if you would put client code in separate file!!!
});
</script>
</head>
<body>
<?php
echo "bla bla bla";
?>
</body>
and +1111 to @ Heera's comment You're missing the basics's.
和 +1111 @ Heera 的评论您缺少基础知识。
回答by Shiplu Mokaddim
Use Heredoc. Thousands of syntax errors will be gone.
使用Heredoc。数以千计的语法错误将消失。
See the heredoc version of your pages,
查看您页面的 heredoc 版本，
- http://pastie.org/3412925
- http://pastie.org/3412929
- http://pastie.org/3412935// Here you have used
includeto contact.includedoes not return anything. It just includes. So Its changed differently.
- http://pastie.org/3412925
- http://pastie.org/3412929
- http://pastie.org/3412935// 这里你曾经
include联系过。include不返回任何东西。它只是包括。所以它发生了不同的变化。
回答by sksumii13
I think it should be
我认为应该是
. (include ($_SERVER['DOCUMENT_ROOT'] . '/../../path/to/include/datepicker.php')) .
otherwise php will try to include all the stuff after until the l is reached (tags will be interpreted as part of the file name).
否则 php 将尝试在达到 l 之后包含所有内容（标签将被解释为文件名的一部分）。
also, in terms of the php code, after the file is included (on success), the include statement translates into 1 as a number, instead of the content of the file.
此外，就 php 代码而言，在包含文件后（成功时），include 语句将转换为 1 作为数字，而不是文件的内容。
use
用
<? $abc <<<qwerty
...
...
...
qwerty;
return qwerty;
?>
for all the files that you want to include
对于您要包含的所有文件
