我正在寻找向我的网站添加简单的赞按钮的最简单方法。基本上,一个按钮,当单击时 - 更改为新图形(让您知道您单击了它),无法再次单击,并发送到 php 脚本,以便服务器知道您喜欢什么。
我认为一个好的技术可能是在 iframe 中放置一个like 按钮,这样您就可以单击它,并且 php 页面可能会回显“感谢您喜欢这个” - 但问题是 iframe 必须有一个来源。我不希望将大量外部文件加载到每个页面中。有什么办法可以让我有一个 iframe 标记并将 HTML 放入其中而不将它放在外部?
我正在寻找向我的网站添加简单的赞按钮的最简单方法。基本上,一个按钮,当单击时 - 更改为新图形(让您知道您单击了它),无法再次单击,并发送到 php 脚本,以便服务器知道您喜欢什么。
我认为一个好的技术可能是在 iframe 中放置一个like 按钮,这样您就可以单击它,并且 php 页面可能会回显“感谢您喜欢这个” - 但问题是 iframe 必须有一个来源。我不希望将大量外部文件加载到每个页面中。有什么办法可以让我有一个 iframe 标记并将 HTML 放入其中而不将它放在外部?
希望这是有道理的。我不知道你的服务器结构,所以我很难建立一个完整的例子,但这应该让你站起来!
文件:Index.php
// query the database and check to see if there is a record for this content piece and ip address
// select count() from statistics where contentId='1' and ip='0.0.0.0' limit 1;
$contentLiked = false;
?>
<html>
<head>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js" ></script>
<script src="site.js"></script>
</head>
<body>
<? if(!$contentLiked): ?>
<a href="JavaScript:void(0);" rel="1" class="likeButton status">like</a>
<? else: ?>
<a href="JavaScript:void(0);" rel="1" class="likeButton status liked">unlike</a>
<? endif ?>
</body>
</html>
文件:site.js
$(document).ready(function() {
$('.likeButton').click(function() {
var contentId = $(this).attr('rel');
var link = this;
if(!$(link).hasClass('liked')) {
$.post("like.php", { Id: contentId }).done(function(data) {
if(data) {
$(link).addClass('liked');
$(link).html('liked');
}
});
}
});
});
文件:like.php
<?
$contentId = $_POST['Id'];
$timestamp = time();
$usersIP = $_SERVER['REMOTE_ADDR'];
// php code to update the database
// insert: contentId, timestamp, ip address
// if injected then echo / print true;
echo 'true';
?>
您应该使用jquery animate。它允许您在使用 jquery 选择的 HTML 元素上创建动画。
使用 Jquery,使用 'click' 事件,您可以使用动画效果,并且有这样的东西:
$("#my-button").click(function(){
$(this).animate({
height: 'toggle'
}, 500, function(){
$(this).animate({
height: 'toggle'
}, 500);
});
});
请参阅以下示例