现在的位置: 主页 > 主打产品 > 文章列表

php实战第四天

作者:厦工楚胜(湖北)专用汽车制造有限公司 来源:www.szzq168.com 发布时间:2017-09-09 10:35:04
 

php实战第四天

好吧先上图,看看,这是 ajax的留言板噢.有瀑布流效果,哈


1.今天学习到了 jquery的ajax,直接上代码


[php] / JavaScript Document
$(document).ready(function(e) {
loadHiglight();//载入高亮特效


$("#submit").click(function() { //“留言”按钮单击事件
//获取用户名称
var strUsetName = $("#userName").val();
//获取输入留言内容
var strContent = $("#content").val();
//获取输入邮箱
var strEmail = $("#email").val();

//开始发送数据
$.ajax({
url: 'index.php?m=index&a=add',
type: 'POST',
dataType: 'json',
data: {
userName: strUsetName,
content: strContent,
email: strEmail
},
success: function(json, textStatus, xhr) {
if (json.state=='ok') {
alert('操作提示,留言成功!');
//alert();
var data=json.data[0];
var strTag=createTag(data.userName,data.content,data.time);

$(strTag).prependTo('div #liuyan');

//$("<b>Hello World!</b>").prependTo("p");
}else{
alert('操作提示,采集软件,留言失败!\n错误信息:'+json.error);
}
}
})
});
//动态载入留言
loadMore();
});

//监视滚动条滚动
$(window).scroll(function() {
// 当滚动到最底部以上100像素时, 加载新内容
if ($(document).height() - $(this).scrollTop() - $(this).height() < 5) {
loadMore();
};
});



fy = 0;
function loadMore() {
fy++;
//alert(fy);
$.getJSON("index.php?m=index&a=data&page=" + fy + "&rand=" + Math.random(), function(json) {

for (var i = 0; i <= json.length - 1; i++) {
//alert(json[i]['userName']);
//content = '<div class="content"><div class="user"><span class="userName">' + json[i]['userName'] + '</span></div><div class="text">' + json[i]['content'] + '</div><div class="time">' + getLocalTime(json[i]['time']) + '</div></div>';
//content='<div class="content">'
//alert(content);
$("div #liuyan").append(createTag(json[i]['userName'],json[i]['content'],json[i]['time']));
loadHiglight();
};

});
}

function loadHiglight() {//为了ajax后重载特效
$user = $("div .user");
$text = $("div .text");

$("div .content").each(function(index) {
$(this).mousemove(function() {

$user.eq(index).css("color", "#0A8CD2");

// $user.eq(index).css("background","#FFE6AD");
// $text.eq(index).css("background","#FFFDF6");

}).mouseout(function() {

$user.eq(index).css("color", "#000");

// $user.eq(index).css("background","#E6F0F9");
// $text.eq(index).css("background","#F8FBFD");
});
});
}
function createTag(usetName, content, time) {
var strTag = '<div class="content"><div class="user"><span class="userName">' + usetName + '</span></div><div class="text">' + content + '</div><div class="time">' + getLocalTime(time) + '</div></div>';
return strTag;
}
function getLocalTime(nS) {
return new Date(parseInt(nS) * 1000).toLocaleString().replace(/:\d{1,2}$/, ' ');
}

// JavaScript Document
$(document).ready(function(e) {
loadHiglight();//载入高亮特效

企业建站2800元起,携手武汉肥猫科技,做一个有见地的颜值派!更多优惠请戳:襄阳SEO http://xiangyang.4567w.com

  • 上一篇:ASP.NET MVC+EF框架+EasyUI实现权限管理系列(13)-权限
  • 下一篇:最后一页