更新:
我正在制作一个喜欢/不喜欢的投票程序,它在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版本和最新版本,但仍然没有运气。在此先感谢您的帮助。
答案 0 :(得分:3)
我正在使用最新版本的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>";
?>
答案 1 :(得分:1)
如果它适用于除Firefox 4以外的所有浏览器,您可能需要查看此主题:
http://forum.jquery.com/topic/jquery-1-4-x-firefox-4-beta-ajax-callbacks
是否使用ajax提交数据?