PHP + JQuery - 如何一起使用这两者?请看我的例子

标签 php jquery

我有一个基于 PHP 的网站。同样,所有页面 html 都是通过 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>
</head>
<body>
<p>CONTENT</p>
</body>
</html>
';

echo $pageStart;
exit;
?>

我想做的是在此页面中使用一些 jquery。

所以我的第一次尝试自然是将脚本包含在 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;
?>

现在,我用的是dreamweavers代码编辑器,由于语法高亮功能,会指出其中产生的大量语法错误。

所以我首先尝试消除这些错误。这失败了。

所以我尝试将 "s 更改为 's,反之亦然,直到错误消失。这也失败了,因为脚本似乎不会以这种方式验证。

所以我看了一些教程,找到了这个:

JavaScript and PHP may each bring great potential to any Web development effort, but they don't always play nice together. Read about the problems.

我的理解是,您需要包含 js 而不是直接将其作为 php 的一部分。

因此有一个名为 page.php 的文件和另一个名为 jquery.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;
?>

和 - 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>

现在两个页面都没有语法错误了,太棒了...所以我尝试了一下,一半期待事情最终能正常工作...

不…… fatal error :无法打开流:没有这样的文件或目录等等。此错误与我添加的包含有关。好吧,即使文件在那里,它也没有被验证为 php,因为没有打开和关闭 php 标签。

所以我添加它们... Annnd... 又是一个充满语法错误的页面!

所以我的问题是:

能否请一些人分享一些知识并向我大致解释一下这个过程实际上是如何工作的。这些语法错误是怎么回事?您应该如何处理这样的任务?

我相信这是可能的,是的,如果我不通过 php 输出整个 html,那肯定会更容易。但这是一个简单的例子,我的实际设计要复杂得多。它需要将页面的不同部分分解为变量,以便在需要时动态放置这些部分。

任何意见、建议或见解将不胜感激;以及任何包含此内容的页面或教程的链接也将不胜感激。

谢谢!!

最佳答案

要在 PHP 中使用 jQuery,您需要做的就是在 HTML 文档的 head 标记中包含 jQuery javascript 文件。实际上,我一直都在使用 PHP 和 jQuery。我就是这样做的。在上面的代码中,您的代码似乎存在一些转义问题。而且看起来您还想将页面的 header 保存在 PHP 变量中,然后将其打印出来。你不必做所有这些。只需将纯文本放入没有任何 php 标记的 PHP 文件中即可。此外,您使用的是旧版本的 jQuery。应该可以使用最新版本。但是,如果您需要将其存储在 PHP 变量中以便打印出来,请执行以下操作:

所以,这里有一些代码可以帮助您入门。

<?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;

?>

关于PHP + JQuery - 如何一起使用这两者?请看我的例子,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/9347966/

相关文章:

javascript - 如何设置第一个div宽度取决于文本宽度,剩余的全宽将分配给第二个div

php - 使用 AJAX 和 PHP 时数据库中的行未被删除

php - 使用 php7 和 apache 设置 php-fpm 状态页面

PHPExcel 一起单元格包含相同的数据问题

javascript - 使用ajax向下拉列表添加值的问题

javascript - Jquery如何检查所有输入是否都有值

jquery - 使用 jQuery 选择当前 div 的第一张图像

php - 有人能给我一个很好的理由来说明为什么 assert in php 的行为方式是这样的吗?

php - makePartial() 返回 Mockery\Exception\BadMethodCallException : Method does not exist on this mock object

php - 如何以数据库函数为源创建一个 Eloquent 模型?