如何从 php 中正确调用 jquery 函数？答案

【问题标题】：how to properly call jquery function from php?如何从 php 中正确调用 jquery 函数？
【发布时间】：2011-06-06 06:07:05
【问题描述】：

更新：

我正在制作一个喜欢/不喜欢的投票程序，它在 Firefox 3、Chrome 和 Safari 中按照我想要的方式运行。但是，它似乎在 Firefox 4 中不起作用。例如，我制作了一个表单，在用户单击提交按钮并将数据发送到 SQL 表后，应该播放一个 jquery 动画。这是完整的代码：

<script type="text/javascript" src="opacity.js"></script>



<link href="voter.css" rel="stylesheet" type="text/css" />

<?php


mysql_connect("","","") or die("Error connecting to db");
mysql_select_db("") or die("Error connecting to db");

$currAdd2 = $_SERVER["REQUEST_URI"];
$currAdd2 = substr($currAdd2, 0, -9);
$currAdd2 = substr($currAdd2, 11);

$numrow1 = mysql_query("SELECT * FROM rate WHERE apt = '$currAdd2' AND likes = 1 ");
$numlikes = mysql_num_rows($numrow1); 

$numrow2 = mysql_query("SELECT * FROM rate WHERE apt = '$currAdd2' AND likes = 0 ");
$numdislikes = mysql_num_rows($numrow2);

$numrow3 = mysql_query("SELECT * FROM rate WHERE apt = '$currAdd2'  ");
$totalvotes = mysql_num_rows($numrow3);

$likewidth = ($numlikes/($totalvotes+1)) * 400;
$dislikewidth = ($numdislikes/($totalvotes+1)) * 400;
?>
<form action= '<?php echo $_SERVER['PHP_SELF']; ?>'; method='post'>
<table align='left' width='500px' border='0' cellpadding='0' cellspacing='0'>
<? echo"      
      <tr>
        <td>
            <div id='blue'><input type='image' name='blue' id='likebutton' value='blue' src='../zrating/like.png' 

            /></div>

        </td>
        <td>
        <b>$numlikes Like</b>
        <div id='like' style='width:$likewidth'><div id='dis'></div></div><br>
        </td>
      </tr>
      <tr>
        <td>
            <div id='red'><input type='image' name='red' id='dislikebutton' value='red' src='../zrating/dislike.png'  

            /></div>

        </td>
        <td>
            <b>$numdislikes Dislike</b>
            <div id='dislike' style='width:$dislikewidth'><div id='dis'></div></div><br>
        </td>
      </tr>
      <tr>
      <td>
      </td>
      <td>
      <div id='success'><br><br>Thanks for voting!</div>
      <div id='fail'><br><br>You are only allowed 1 vote per apartment.</div>     
      </td>
      </tr>
  </table>
</form>
";


//check ip address
    if (!empty($_SERVER['HTTP_CLIENT_IP']))   //check ip from share internet
    {
      $ip=$_SERVER['HTTP_CLIENT_IP'];
    }
    elseif (!empty($_SERVER['HTTP_X_FORWARDED_FOR']))   //to check ip is pass from proxy
    {
      $ip=$_SERVER['HTTP_X_FORWARDED_FOR'];
    }
    else
    {
      $ip=$_SERVER['REMOTE_ADDR'];
    }



if ( isset( $_POST['blue'] ) )
{

    $currAdd = $_SERVER["REQUEST_URI"];
    $currAdd = substr($currAdd, 0, -9);
    $currAdd = substr($currAdd, 11);

    $ipquery = mysql_query ("SELECT * FROM rate WHERE ip = '$ip' AND apt = '$currAdd' ");
    $ipquery = mysql_fetch_assoc($ipquery);
    $ipquery = $ipquery['ip'];


    if ($ipquery == $ip)
    {
        echo "<script type='text/javascript' src='jquery.js'></script>";


                echo "<script type='text/javascript'>
                 $(document).ready(function()
    {
    $('#fail').animate({width:300},1000);
    $('#fail').animate({height:100},1000);
    $('#fail').animate({width:300,height:100},1400);
    $('#fail').fadeOut(5000);

    }); </script>";

    }
    else
    {

    mysql_query ("INSERT INTO rate VALUES ('','$currAdd', '1', '$ip')");            

    $rankqry = mysql_query ("SELECT * FROM rank WHERE apt = '$currAdd' ");
    $rankqry = mysql_fetch_assoc($rankqry);
    $rankqry = $rankqry['rank'];

    $rankupdate = $rankqry + 1;

        if($rankupdate < 0)
        {
        $rankupdate = 0;
        }

    mysql_query ("UPDATE rank SET rank = '$rankupdate' WHERE apt = '$currAdd' ");
    $likesqry = mysql_query ("SELECT * FROM rank WHERE apt = '$currAdd' ");
    $likesqry = mysql_fetch_assoc($likesqry);
    $likesqry = $likesqry['likes'];

    $likesupdate = $likesqry +1;

    mysql_query ("UPDATE rank SET likes = '$likesupdate' WHERE apt = '$currAdd' ");

            echo "<script type='text/javascript' src='jquery.js'></script>";


        echo "<script type='text/javascript'>
                 $(document).ready(function()
    {
    $('#success').animate({width:300},1000);
    $('#success').animate({height:100},1000);
    $('#success').animate({width:300,height:100},1400);
    $('#success').fadeOut(5000);

    }); </script>";

}

}


if ( isset( $_POST['red'] ) )
{
    $currAdd = $_SERVER["REQUEST_URI"];
    $currAdd = substr($currAdd, 0, -9);
    $currAdd = substr($currAdd, 11);

    $ipquery = mysql_query ("SELECT * FROM rate WHERE ip = '$ip' AND apt = '$currAdd' ");
    $ipquery = mysql_fetch_assoc($ipquery);
    $ipquery = $ipquery['ip'];

    if ($ipquery == $ip)
    {
                echo "<script type='text/javascript' src='jquery.js'></script>";


                echo "<script type='text/javascript'>
                 $(document).ready(function()
    {
    $('#fail').animate({width:300},1000);
    $('#fail').animate({height:100},1000);
    $('#fail').animate({width:300,height:100},1400);
    $('#fail').fadeOut(5000);

    }); </script>";


    }
    else
    {

mysql_query ("INSERT INTO rate VALUES ('','$currAdd', '0', '$ip')");    

$rankqry = mysql_query ("SELECT * FROM rank WHERE apt = '$currAdd' ");
$rankqry = mysql_fetch_assoc($rankqry);
$rankqry = $rankqry['rank'];

$rankupdate = $rankqry - 1;

if($rankupdate < 0)
{
    $rankupdate = 0;
}


mysql_query ("UPDATE rank SET rank = '$rankupdate' WHERE apt = '$currAdd' ");

$dislikesqry = mysql_query ("SELECT * FROM rank WHERE apt = '$currAdd' ");
$dislikesqry = mysql_fetch_assoc($dislikesqry);
$dislikesqry = $dislikesqry['dislikes'];

$dislikesupdate = $dislikesqry +1;

    mysql_query ("UPDATE rank SET dislikes = '$dislikesupdate' WHERE apt = '$currAdd' ");

            echo "<script type='text/javascript' src='jquery.js'></script>";



                    echo "<script type='text/javascript'>
                 $(document).ready(function()
    {
    $('#success').animate({width:300},1000);
    $('#success').animate({height:100},1000);
    $('#success').animate({width:300,height:100},1400);
    $('#success').fadeOut(5000);

    }); </script>";


    }
}
?>

我使用了 jquery 库的 1.4.2 版本和最新版本，但仍然没有运气。提前感谢您的帮助。

【问题讨论】：

是ajax请求还是常规页面请求？

标签： php javascript jquery call

【解决方案1】：

我正在使用最新版本的 jQuery (1.6.1)，以下代码在我的服务器上运行得非常好：

<?php

echo '<html>
<head>
</head>
<body>

<div id="success">
    Success! Success! Success! Success! Success! Success! Success! Success! Success! Success! Success! Success! Success! Success!
</div>

<script type="text/javascript" src="js/jquery-1.6.1.min.js"></script>
<script type="text/javascript">
$(document).ready(function()
{
    $(\'#success\').animate({width:300},1000);
    $(\'#success\').animate({height:100},1000);
    $(\'#success\').animate({width:300,height:100},1400);
    $(\'#success\').fadeOut(5000);
});
</script>
</body></html>';

?>

编辑：这是link to my test PHP script

第二次编辑：我想在我的答案中添加一些内容。如果没有上下文，很难判断这是否是一个问题，但请确保在对 jQuery 进行任何调用之前加载 jQuery JS 文件。您所做的动画调用可以在 HTML 块之外完成，但不能在加载 jQuery JS 文件之前完成。例如，这会起作用：

<?php

echo '<html>
<head>
</head>
<body>

<div id="success">
    Success! Success! Success! Success! Success! Success! Success! Success! Success! Success! Success! Success! Success! Success!
</div>

<script type="text/javascript" src="js/jquery-1.6.1.min.js"></script>
</body></html>';

if ( isset( $_POST['submit'] ) )
{
    mysql_query ("INSERT INTO table VALUES ('','', '', '')");

    echo "<script type='text/javascript'>
             $(document).ready(function()
    {
        $('#success').animate({width:300},1000);
        $('#success').animate({height:100},1000);
        $('#success').animate({width:300,height:100},1400);
        $('#success').fadeOut(5000);
    }); </script>";
}

?>

但这不会：

<?php

echo '<html>
<head>
</head>
<body>

<div id="success">
    Success! Success! Success! Success! Success! Success! Success! Success! Success! Success! Success! Success! Success! Success!
</div>

<script type="text/javascript">
$(document).ready(function()
{
    $(\'#success\').animate({width:300},1000);
    $(\'#success\').animate({height:100},1000);
    $(\'#success\').animate({width:300,height:100},1400);
    $(\'#success\').fadeOut(5000);
});
</script>
<script type="text/javascript" src="js/jquery-1.6.1.min.js"></script>
</body></html>';

?>

使用在线 jQuery 1.6.1 文件

<form action= '<?php echo $_SERVER['PHP_SELF']; ?>'; method='post'>
<table align='left' width='500px' border='0' cellpadding='0' cellspacing='0'>
<?
   // Using online jQuery 1.6.1 file
   echo"      
      <tr>
        <td>
            <div id='blue'><input type='image' name='blue' id='likebutton' value='blue' src='../zrating/like.png' 

            /></div>

        </td>
        <td>
        <b>$numlikes Like</b>
        <div id='like' style='width:$likewidth'><div id='dis'></div></div><br>
        </td>
      </tr>
      <tr>
        <td>
            <div id='red'><input type='image' name='red' id='dislikebutton' value='red' src='../zrating/dislike.png'  

            /></div>

        </td>
        <td>
            <b>$numdislikes Dislike</b>
            <div id='dislike' style='width:$dislikewidth'><div id='dis'></div></div><br>
        </td>
      </tr>
      <tr>
      <td>
      </td>
      <td>
      <div id='success'><br><br>Thanks for voting!</div>
      <div id='fail'><br><br>You are only allowed 1 vote per apartment.</div>     
      </td>
      </tr>
  </table>
</form>
";

echo "<script type='text/javascript' src='http://code.jquery.com/jquery-1.6.1.min.js'></script>";


                echo "<script type='text/javascript'>
                 $(document).ready(function()
    {
    $('#fail').animate({width:200},1000);
    $('#fail').animate({height:100},1000);
    $('#fail').fadeOut(5000);

    }); </script>";
?>

【讨论】：

我在 PHP 标签中加入了但它仍然没有不行。我将在我的 OP 中发布完整的代码。
它在我的服务器上运行良好。您确定包含正确的脚本吗？当我在您的 OP 中查看您的完整代码时，它显示 jquery.js。这是您的 jQuery 文件的正确路径吗？我所做的只是复制您的表单和第一个 if 语句的动画，并将 if 语句更改为指向我服务器上的 jQuery1.6.1 JS 文件：iyikes.com/phpservertest.php
您是否在 Firefox 4 中运行过它？我将 js 文件的源更改为ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js，但它仍然无法正常工作。在我发布的其他论坛上，他们提到我的脚本无效，因为我没有包含 doctype、html 标签、head 标签和 body 标签，并且我在“怪癖”模式下运行。然后我包含了文档类型和标签，但问题没有解决。
是的，我在 FF4 中运行它，它运行良好。它一定是你正在用你的代码做的事情。尝试使用我编辑的 EXACT 代码，注释为“使用在线 jQuery 1.6.1 文件”
“使用在线jQuery 1.6.1文件”中的代码好像一开始就被截断了一部分？我复制粘贴了以“/>
”开头的框架中的代码和在 Firefox 4 中播放的动画。这对我的问题意味着什么？

【解决方案2】：

如果它适用于除 Firefox 4 之外的所有浏览器，您可能需要查看此线程：

http://forum.jquery.com/topic/jquery-1-4-x-firefox-4-beta-ajax-callbacks

数据是用ajax提交的吗？

【讨论】：

不，我以前没用过 ajax。
您可以假设，如果它适用于除 FF4 之外的所有浏览器，则不取决于您的脚本。但不能解决你的问题。
希望如此！在我看来，Firefox 一直是理想的浏览器。由于FF4不太确定。不过我认为下一次更新是 FF5。