Thinkphp 中利用js，ajax写的无限下拉加载效果
2017-06-26 11:50
609 查看
控制器代码：
public function index(){
$news = M('System_voice');
$news2=M('System_voice')->where(array('status'=> 1))->select();
$category = D('System_voice_category')->where(array('status'=> 1))->order('sort DESC')->select();
$condition_news['category_id'] = $category[0]['id'];
$condition_news['status'] = 1;
//$page = $_GET['page'] ? intval($_GET['page']) : 1;
$news = M('System_voice');
$return['count'] = $news->where(array('category_id'=> $category[0]['id'],'status'=>'1'))->count();
if($return['count'] > ($page-1)*20){
//$return['news_list'] = $news->where(array('category_id'=> $category[0]['id'],'status'=>'1'))->order('sort DESC,id DESC')->limit((($page-1)*5).',5')->select();
$return['news_list'] = $news->where(array('category_id'=> $category[0]['id'],'status'=>'1'))->order('sort DESC,id DESC')->limit(5)->select();
}else{
$return['news_list'] = array();
}
$return['totalPage'] = ceil($return['count']/5);
$key = array_search($condition_news['category_id'],$category);
$this->assign('news2',$news2);
$this->assign('now_cat',$category[$key]['name']);
$this->assign("category",$category);
$this->assign("now_cat_id",$category[0]['id']);
$this->assign("count",$return['count']);
$this->assign("news_list",$return['news_list']);
$this->assign("news_list_size",sizeof($return['news_list']));
$this->display();
}
public function ajax_index(){
$news = M('System_voice');
$news2=M('System_voice')->where(array('status'=> 1))->select();
$category = D('System_voice_category')->where(array('status'=> 1))->order('sort DESC')->select();
$condition_news['category_id'] = $category[0]['id'];
$condition_news['status'] = 1;
$page = $_REQUEST['page'] ? intval($_REQUEST['page']) : 1;
//var_dump($page);
$news = M('System_voice');
$return['count'] = $news->where(array('category_id'=> $category[0]['id'],'status'=>'1'))->count();
if($return['count'] > ($page-1)*5){
//$return['news_list'] = $news->where(array('category_id'=> $category[0]['id'],'status'=>'1'))->order('sort DESC,id DESC')->limit((($page-1)*5).',5')->select();
$return['news_list'] = $news->where(array('category_id'=> $category[0]['id'],'status'=>'1'))->order('sort DESC,id DESC')->limit((($page-1)*5).',5')->select();
}else{
$return['news_list'] = array();
}
$ocount=$return['count']%5;
$return['totalPage'] = ceil($return['count']/5);
$key = array_search($condition_news['category_id'],$category);
//exit(json_encode(array('error_code'=>0,'error_reason'=>'获取成功','result'=>$return['news_list'])));
$this->assign("news_list",$return['news_list']);
$this->assign("ocount",$ocount);
//$this->assign("totalPage",$return['totalPage']);
$this->display();
}
public function ajaxList(){
$this->header_json();
$totalRows=15;
$page = $_GET['page'] ? intval($_GET['page']) : 1;
$news = M('System_voice');
$return['count'] = $news->where(array('category_id'=>$_GET['cat_id'],'status'=>'1'))->count();
if($return['count'] > ($page-1)*$totalRows){
$return['news_list'] = $news->where(array('category_id'=>$_GET['cat_id'],'status'=>'1'))->order('sort DESC,id DESC')->limit((($page-1)*$totalRows),$totalRows)->select();
}else{
$return['news_list'] = array();
}
$return['totalPage'] = ceil($return['count']/10);
echo json_encode($return);
}视图代码：index.php
<?php if(!defined('PigCms_VERSION')){ exit('deny access!');} ?>
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=0.5, maximum-scale=2.0, user-scalable=yes" />
<meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no, width=device-width"/>
<meta name="apple-mobile-web-app-capable" content="yes"/>
<meta name='apple-touch-fullscreen' content='yes'/>
<meta name="apple-mobile-web-app-status-bar-style" content="black"/>
<meta name="format-detection" content="telephone=no"/>
<meta name="format-detection" content="address=no"/>
<link rel="stylesheet" type="text/css" href="{pigcms{$static_path}css/common.css?210"/>
<link rel="stylesheet" type="text/css" href="{pigcms{$static_path}css/village.css?213"/>
<script type="text/javascript" src="{pigcms{:C('JQUERY_FILE_190')}" charset="utf-8"></script>
<script type="text/javascript" src="{pigcms{$static_path}js/idangerous.swiper.min.js" charset="utf-8"></script>
<script type="text/javascript" src="{pigcms{$static_path}js/fastclick.js" charset="utf-8"></script>
<script type="text/javascript" src="{pigcms{$static_path}/layer/layer.m.js" charset="utf-8"></script>
<script type="text/javascript" src="{pigcms{$static_path}js/common.js?210" charset="utf-8"></script>
<link rel="stylesheet" type="text/css" href="http://localhost/tpl/Wap/pure/static/raty/jquery.raty.css"/>
<script type="text/javascript" src="http://localhost/tpl/Wap/pure/static/raty/jquery.raty.js" charset="utf-8"></script>
<script type="text/javascript">
var location_url = "{pigcms{:U('Systemvoice/ajaxList')}";
var backUrl = "{pigcms{:C('config.site_url')}/wap.php";
var now_cat_id = "{pigcms{$now_cat_id}";
var count = "{pigcms{$count}";
</script>
<script type="text/javascript" src="{pigcms{$static_path}js/newslist.js?215" charset="utf-8"></script>
<style>
.title1{
font-family:"Microsoft Yahei";
letter-spacing:0.5px;
color:#999;
height:40px;
overflow:hidden;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
word-break: break-all;
padding-left:10px;
padding-right:10px;
padding-top:5px;
padding-bottom:5px;
}
.title2{
font-family:"Microsoft Yahei";
letter-spacing:0.5px;
color:black;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
padding-right:30px;
padding-top:10px;
padding-bottom:10px;
}
.title3{
font-family:"Microsoft Yahei";
letter-spacing:0.5px;
color:#999;
padding-left:10px;
padding-right:10px;
padding-top:10px;
padding-bottom:15px;
}
#container{
background-color:230, 229, 235;
}
.newsListBox dd div{
padding-left:12px;
padding-right:20px;
margin-right:30px;
overflow:hidden;
word-break:keep-all;
white-space:nowrap;
text-overflow:ellipsis;
font-size:12px;
margin-bottom: 0px;
margin-top: 0px;
padding-top: 10px;
padding-bottom: 0px;
}
#co{
color:#999;
}
.conhr{
border-radius: 15px;
background-color:#F7F7F7;
border-bottom: 1px solid #f1f1f1;
margin-right:10px;
margin-left:10px;
margin-bottom: 10px;
margin-top: 0px;
}
.conhr dd{
margin-top:12px;
border-radius: 15px;
background-color:#F7F7F7;
font-family:"Microsoft Yahei";
letter-spacing:1px;
margin-bottom: 0px;
margin-top: 0px;
padding-top: 0px;
padding-bottom: 0px;
}
body{
margin:0 auto;
padding:0 auto;
}
#co2{
color:#999;
height:40px;
overflow:hidden;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
word-break: break-all;
font-family:"Microsoft Yahei";
letter-spacing:1px;
}
#ljdi
4000
v{
margin:0;
padding:0;
}
#coo{
padding: 10px 6px;
}
</style>
</head>
<body>
<if condition="!$is_app_browser">
<header style="display:none"><div id="backBtn"></div>语音导游</header>
</if>
<div id="container">
<div id="pullDown">
<span class="pullDownIcon"></span><span class="pullDownLabel">下拉刷新页面</span>
</div>
<section class="villageBox newsBox newsListBox">
<div class="headBox newsheader" style="width:0px; height:0px;">
<div class="swiper-container swiper-container1">
<ul class="swiper-wrapper">
<volist name="category" id="vo">
<li hidden class="swiper-slide <if condition="$i eq 1">on</if>" data-cat_id="{pigcms{$vo.id}"></li>
</volist>
</ul>
</div>
</div>
<!--<dl id="dl2">
<volist name="news_list" id="vo">
<dd data-url="{pigcms{:U('Systemvoice/news',array('id'=>$vo['id']))}">
<div>{pigcms{$vo.title}</div>
</dd>
</volist>
</dl>-->
</section>
<input type="hidden" value="{pigcms{$news_list_size}" id="count1">
<input type="hidden" value="{pigcms{$count}" id="count">
<volist name="news_list" id="vo">
<div style="background-color:white;width:96%;margin:0px auto;margin-top:5px;border-radius:5px;">
<a href="{pigcms{$vo['lianjie']}"><div class="title2" style="padding-left:10px;"><img style="width:10px;height:15px;padding-right:12px;" src="./tpl/Wap/static/images/new_my/title_left.png"/><font style="font-size:17px">{pigcms{$vo['title']}</font><br /></div></a>
<a href="{pigcms{$vo['lianjie']}"><div><img style="width:100%;" src="{pigcms{$vo['img4']}" /></div></a>
<div class="title1">{pigcms{$vo['introduction']}</div>
<div class="title3">
<div style="float:left;"><img class="sc" id="{pigcms{$vo['id']}" onClick="sc(this)" style="width:15px;height:15px;padding-left:0px;margin-left:0px;" src="./tpl/Wap/static/images/new_my/like.png"/> <font id="fav{pigcms{$vo.id}" color="#CCCCCC">{pigcms{$vo['fav']}</font> </div>
<div style="float:left; margin-left:40px;"> <div class="score" name="{pigcms{$vo['id']}" id="{pigcms{$vo['score']}"></div></div>
<div style="float:right;margin-right:20px"><a href="{pigcms{:U('Systemvoice/map2',array('id'=>$vo['id']))}"><img style="width:13px;height:13px" src="./tpl/Wap/static/images/new_my/ditudaohahng.png"/></a></div>
<div style="clear:both;"></div>
</div>
</div>
</volist>
<input type="hidden" name="score" id="sc" value="5"/>
</div>
<script type="text/javascript">
function sc(obj){
var id = $(obj).attr("id");
var fav = '#fav'+id;
var num = parseInt($(fav).text())+1;
$.ajax({
type:"POST",
url:"{pigcms{:U('Systemvoice/scajax')}",
data:"id="+id,
cache:false, //不缓存此页面
success:function(data){
$(fav).text(num);
}
});
}
$(document).ready(function(){
$("#container").css('top','0px');
var count = $("#count").val();
var count2 = $("#count1").val();
var count3 = count2 * 290+"px";
$("#container").css('height',count3);
var page = 2;
$(window).scroll(function () {
if ($(document).scrollTop() + $(window).height() >= $(document).height()) {
$.ajax({
type:"POST",
url:"{pigcms{:U('Systemvoice/ajax_index')}",
data: {page:page},
dataType:'html',
cache:false, //不缓存此页面
success:function(msg){
var ocount = $(msg).find("#ocount").val();
var totalPage = $(msg).find("#totalPage").val();
$("#container").append(msg);
//var count4 = count2 * 290 * page+"px";
var count5 = count * 290 +"px";
$("#container").css('height',count5);
page++;
}
});
}
});
})
$("body").unbind("click");
$("a").click(function(){
var href = $(this).attr("href");
window.location.href= href;
});
window.shareData = {
"moduleName":"Systemnews",
"moduleID":"0",
"imgUrl": "<if condition="$config['wechat_share_img']">{pigcms{$config.wechat_share_img}<else/>{pigcms{$config.site_logo}</if>",
"sendFriendLink": "{pigcms{$config.site_url}{pigcms{:U('Systemnews/index')}",
"tTitle": "平台快报 - {pigcms{$config.site_name}",
"tContent": "点击查看快报详细内容"
};
$.fn.raty.defaults.path = 'http://www.97farm.com/tpl/Wap/bluesky/static/raty/images';
//$('.score').raty({readOnly: true,score:2.5});
$('.score').each(function(i,e){
var v = $(this).attr("id");
$(this).raty({score:v,
click: function(score, evt) {
var id = $(this).attr("name");
$.ajax({
type:"POST",
url:"{pigcms{:U('Systemvoice/pfajax')}",
data: {id:id,score:score},
cache:false, //不缓存此页面
success:function(data){
//$("#sc").val(score);
}
});
//alert('ID: ' + this.id + "\nscore: " + score + "\nevent: " + evt);
$("#sc").val(score);
}
});
});
</script>
{pigcms{$shareScript}
</body>
</html>ajax_index.php页面
<html>
<head>
<title>测试1</title>
</head>
<body>
<volist name="news_list" id="vo">
<div style="background-color:white;width:96%;margin:0px auto;margin-top:5px;border-radius:5px;">
<a href="{pigcms{$vo['lianjie']}"><div class="title2" style="padding-left:10px;"><img style="width:10px;height:15px;padding-right:12px;" src="./tpl/Wap/static/images/new_my/title_left.png"/><font style="font-size:17px">{pigcms{$vo['title']}</font><br /></div></a>
<a href="{pigcms{$vo['lianjie']}"><div><img style="width:100%;" src="{pigcms{$vo['img4']}" /></div></a>
<div class="title1">{pigcms{$vo['introduction']}</div>
<div class="title3">
<div style="float:left;"><img class="sc" id="{pigcms{$vo['id']}" onClick="sc(this)" style="width:15px;height:15px;padding-left:0px;margin-left:0px;" src="./tpl/Wap/static/images/new_my/like.png"/> <font id="fav{pigcms{$vo.id}" color="#CCCCCC">{pigcms{$vo['fav']}</font> </div>
<div style="float:left; margin-left:40px;"> <div class="score" name="{pigcms{$vo['id']}" id="{pigcms{$vo['score']}"></div></div>
<div style="float:right;margin-right:20px"><a href="{pigcms{:U('Systemvoice/map2',array('id'=>$vo['id']))}"><img style="width:13px;height:13px" src="./tpl/Wap/static/images/new_my/ditudaohahng.png"/></a></div>
<div style="clear:both;"></div>
</div>
</div>
</volist>
<span>
<input type="hidden" id="ocount" value="{pigcms{$ocount}"/>
<input type="hidden" id="totalPage" value="{pigcms{$totalPage}"/>
</span>
<script>
$.fn.raty.defaults.path = 'http://www.97farm.com/tpl/Wap/bluesky/static/raty/images';
//$('.score').raty({readOnly: true,score:2.5});
$('.score').each(function(i,e){
var v = $(this).attr("id");
$(this).raty({score:v,
click: function(score, evt) {
var id = $(this).attr("name");
$.ajax({
type:"POST",
url:"{pigcms{:U('Systemvoice/pfajax')}",
data: {id:id,score:score},
cache:false, //不缓存此页面
success:function(data){
//$("#sc").val(score);
}
});
//alert('ID: ' + this.id + "\nscore: " + score + "\nevent: " + evt);
$("#sc").val(score);
}
});
});
$("body").unbind("click");
$("a").click(function(){
var href = $(this).attr("href");
window.location.href= href;
});
</script>
</body>
</html>
public function index(){
$news = M('System_voice');
$news2=M('System_voice')->where(array('status'=> 1))->select();
$category = D('System_voice_category')->where(array('status'=> 1))->order('sort DESC')->select();
$condition_news['category_id'] = $category[0]['id'];
$condition_news['status'] = 1;
//$page = $_GET['page'] ? intval($_GET['page']) : 1;
$news = M('System_voice');
$return['count'] = $news->where(array('category_id'=> $category[0]['id'],'status'=>'1'))->count();
if($return['count'] > ($page-1)*20){
//$return['news_list'] = $news->where(array('category_id'=> $category[0]['id'],'status'=>'1'))->order('sort DESC,id DESC')->limit((($page-1)*5).',5')->select();
$return['news_list'] = $news->where(array('category_id'=> $category[0]['id'],'status'=>'1'))->order('sort DESC,id DESC')->limit(5)->select();
}else{
$return['news_list'] = array();
}
$return['totalPage'] = ceil($return['count']/5);
$key = array_search($condition_news['category_id'],$category);
$this->assign('news2',$news2);
$this->assign('now_cat',$category[$key]['name']);
$this->assign("category",$category);
$this->assign("now_cat_id",$category[0]['id']);
$this->assign("count",$return['count']);
$this->assign("news_list",$return['news_list']);
$this->assign("news_list_size",sizeof($return['news_list']));
$this->display();
}
public function ajax_index(){
$news = M('System_voice');
$news2=M('System_voice')->where(array('status'=> 1))->select();
$category = D('System_voice_category')->where(array('status'=> 1))->order('sort DESC')->select();
$condition_news['category_id'] = $category[0]['id'];
$condition_news['status'] = 1;
$page = $_REQUEST['page'] ? intval($_REQUEST['page']) : 1;
//var_dump($page);
$news = M('System_voice');
$return['count'] = $news->where(array('category_id'=> $category[0]['id'],'status'=>'1'))->count();
if($return['count'] > ($page-1)*5){
//$return['news_list'] = $news->where(array('category_id'=> $category[0]['id'],'status'=>'1'))->order('sort DESC,id DESC')->limit((($page-1)*5).',5')->select();
$return['news_list'] = $news->where(array('category_id'=> $category[0]['id'],'status'=>'1'))->order('sort DESC,id DESC')->limit((($page-1)*5).',5')->select();
}else{
$return['news_list'] = array();
}
$ocount=$return['count']%5;
$return['totalPage'] = ceil($return['count']/5);
$key = array_search($condition_news['category_id'],$category);
//exit(json_encode(array('error_code'=>0,'error_reason'=>'获取成功','result'=>$return['news_list'])));
$this->assign("news_list",$return['news_list']);
$this->assign("ocount",$ocount);
//$this->assign("totalPage",$return['totalPage']);
$this->display();
}
public function ajaxList(){
$this->header_json();
$totalRows=15;
$page = $_GET['page'] ? intval($_GET['page']) : 1;
$news = M('System_voice');
$return['count'] = $news->where(array('category_id'=>$_GET['cat_id'],'status'=>'1'))->count();
if($return['count'] > ($page-1)*$totalRows){
$return['news_list'] = $news->where(array('category_id'=>$_GET['cat_id'],'status'=>'1'))->order('sort DESC,id DESC')->limit((($page-1)*$totalRows),$totalRows)->select();
}else{
$return['news_list'] = array();
}
$return['totalPage'] = ceil($return['count']/10);
echo json_encode($return);
}视图代码：index.php
<?php if(!defined('PigCms_VERSION')){ exit('deny access!');} ?>
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=0.5, maximum-scale=2.0, user-scalable=yes" />
<meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no, width=device-width"/>
<meta name="apple-mobile-web-app-capable" content="yes"/>
<meta name='apple-touch-fullscreen' content='yes'/>
<meta name="apple-mobile-web-app-status-bar-style" content="black"/>
<meta name="format-detection" content="telephone=no"/>
<meta name="format-detection" content="address=no"/>
<link rel="stylesheet" type="text/css" href="{pigcms{$static_path}css/common.css?210"/>
<link rel="stylesheet" type="text/css" href="{pigcms{$static_path}css/village.css?213"/>
<script type="text/javascript" src="{pigcms{:C('JQUERY_FILE_190')}" charset="utf-8"></script>
<script type="text/javascript" src="{pigcms{$static_path}js/idangerous.swiper.min.js" charset="utf-8"></script>
<script type="text/javascript" src="{pigcms{$static_path}js/fastclick.js" charset="utf-8"></script>
<script type="text/javascript" src="{pigcms{$static_path}/layer/layer.m.js" charset="utf-8"></script>
<script type="text/javascript" src="{pigcms{$static_path}js/common.js?210" charset="utf-8"></script>
<link rel="stylesheet" type="text/css" href="http://localhost/tpl/Wap/pure/static/raty/jquery.raty.css"/>
<script type="text/javascript" src="http://localhost/tpl/Wap/pure/static/raty/jquery.raty.js" charset="utf-8"></script>
<script type="text/javascript">
var location_url = "{pigcms{:U('Systemvoice/ajaxList')}";
var backUrl = "{pigcms{:C('config.site_url')}/wap.php";
var now_cat_id = "{pigcms{$now_cat_id}";
var count = "{pigcms{$count}";
</script>
<script type="text/javascript" src="{pigcms{$static_path}js/newslist.js?215" charset="utf-8"></script>
<style>
.title1{
font-family:"Microsoft Yahei";
letter-spacing:0.5px;
color:#999;
height:40px;
overflow:hidden;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
word-break: break-all;
padding-left:10px;
padding-right:10px;
padding-top:5px;
padding-bottom:5px;
}
.title2{
font-family:"Microsoft Yahei";
letter-spacing:0.5px;
color:black;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
padding-right:30px;
padding-top:10px;
padding-bottom:10px;
}
.title3{
font-family:"Microsoft Yahei";
letter-spacing:0.5px;
color:#999;
padding-left:10px;
padding-right:10px;
padding-top:10px;
padding-bottom:15px;
}
#container{
background-color:230, 229, 235;
}
.newsListBox dd div{
padding-left:12px;
padding-right:20px;
margin-right:30px;
overflow:hidden;
word-break:keep-all;
white-space:nowrap;
text-overflow:ellipsis;
font-size:12px;
margin-bottom: 0px;
margin-top: 0px;
padding-top: 10px;
padding-bottom: 0px;
}
#co{
color:#999;
}
.conhr{
border-radius: 15px;
background-color:#F7F7F7;
border-bottom: 1px solid #f1f1f1;
margin-right:10px;
margin-left:10px;
margin-bottom: 10px;
margin-top: 0px;
}
.conhr dd{
margin-top:12px;
border-radius: 15px;
background-color:#F7F7F7;
font-family:"Microsoft Yahei";
letter-spacing:1px;
margin-bottom: 0px;
margin-top: 0px;
padding-top: 0px;
padding-bottom: 0px;
}
body{
margin:0 auto;
padding:0 auto;
}
#co2{
color:#999;
height:40px;
overflow:hidden;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
word-break: break-all;
font-family:"Microsoft Yahei";
letter-spacing:1px;
}
#ljdi
4000
v{
margin:0;
padding:0;
}
#coo{
padding: 10px 6px;
}
</style>
</head>
<body>
<if condition="!$is_app_browser">
<header style="display:none"><div id="backBtn"></div>语音导游</header>
</if>
<div id="container">
<div id="pullDown">
<span class="pullDownIcon"></span><span class="pullDownLabel">下拉刷新页面</span>
</div>
<section class="villageBox newsBox newsListBox">
<div class="headBox newsheader" style="width:0px; height:0px;">
<div class="swiper-container swiper-container1">
<ul class="swiper-wrapper">
<volist name="category" id="vo">
<li hidden class="swiper-slide <if condition="$i eq 1">on</if>" data-cat_id="{pigcms{$vo.id}"></li>
</volist>
</ul>
</div>
</div>
<!--<dl id="dl2">
<volist name="news_list" id="vo">
<dd data-url="{pigcms{:U('Systemvoice/news',array('id'=>$vo['id']))}">
<div>{pigcms{$vo.title}</div>
</dd>
</volist>
</dl>-->
</section>
<input type="hidden" value="{pigcms{$news_list_size}" id="count1">
<input type="hidden" value="{pigcms{$count}" id="count">
<volist name="news_list" id="vo">
<div style="background-color:white;width:96%;margin:0px auto;margin-top:5px;border-radius:5px;">
<a href="{pigcms{$vo['lianjie']}"><div class="title2" style="padding-left:10px;"><img style="width:10px;height:15px;padding-right:12px;" src="./tpl/Wap/static/images/new_my/title_left.png"/><font style="font-size:17px">{pigcms{$vo['title']}</font><br /></div></a>
<a href="{pigcms{$vo['lianjie']}"><div><img style="width:100%;" src="{pigcms{$vo['img4']}" /></div></a>
<div class="title1">{pigcms{$vo['introduction']}</div>
<div class="title3">
<div style="float:left;"><img class="sc" id="{pigcms{$vo['id']}" onClick="sc(this)" style="width:15px;height:15px;padding-left:0px;margin-left:0px;" src="./tpl/Wap/static/images/new_my/like.png"/> <font id="fav{pigcms{$vo.id}" color="#CCCCCC">{pigcms{$vo['fav']}</font> </div>
<div style="float:left; margin-left:40px;"> <div class="score" name="{pigcms{$vo['id']}" id="{pigcms{$vo['score']}"></div></div>
<div style="float:right;margin-right:20px"><a href="{pigcms{:U('Systemvoice/map2',array('id'=>$vo['id']))}"><img style="width:13px;height:13px" src="./tpl/Wap/static/images/new_my/ditudaohahng.png"/></a></div>
<div style="clear:both;"></div>
</div>
</div>
</volist>
<input type="hidden" name="score" id="sc" value="5"/>
</div>
<script type="text/javascript">
function sc(obj){
var id = $(obj).attr("id");
var fav = '#fav'+id;
var num = parseInt($(fav).text())+1;
$.ajax({
type:"POST",
url:"{pigcms{:U('Systemvoice/scajax')}",
data:"id="+id,
cache:false, //不缓存此页面
success:function(data){
$(fav).text(num);
}
});
}
$(document).ready(function(){
$("#container").css('top','0px');
var count = $("#count").val();
var count2 = $("#count1").val();
var count3 = count2 * 290+"px";
$("#container").css('height',count3);
var page = 2;
$(window).scroll(function () {
if ($(document).scrollTop() + $(window).height() >= $(document).height()) {
$.ajax({
type:"POST",
url:"{pigcms{:U('Systemvoice/ajax_index')}",
data: {page:page},
dataType:'html',
cache:false, //不缓存此页面
success:function(msg){
var ocount = $(msg).find("#ocount").val();
var totalPage = $(msg).find("#totalPage").val();
$("#container").append(msg);
//var count4 = count2 * 290 * page+"px";
var count5 = count * 290 +"px";
$("#container").css('height',count5);
page++;
}
});
}
});
})
$("body").unbind("click");
$("a").click(function(){
var href = $(this).attr("href");
window.location.href= href;
});
window.shareData = {
"moduleName":"Systemnews",
"moduleID":"0",
"imgUrl": "<if condition="$config['wechat_share_img']">{pigcms{$config.wechat_share_img}<else/>{pigcms{$config.site_logo}</if>",
"sendFriendLink": "{pigcms{$config.site_url}{pigcms{:U('Systemnews/index')}",
"tTitle": "平台快报 - {pigcms{$config.site_name}",
"tContent": "点击查看快报详细内容"
};
$.fn.raty.defaults.path = 'http://www.97farm.com/tpl/Wap/bluesky/static/raty/images';
//$('.score').raty({readOnly: true,score:2.5});
$('.score').each(function(i,e){
var v = $(this).attr("id");
$(this).raty({score:v,
click: function(score, evt) {
var id = $(this).attr("name");
$.ajax({
type:"POST",
url:"{pigcms{:U('Systemvoice/pfajax')}",
data: {id:id,score:score},
cache:false, //不缓存此页面
success:function(data){
//$("#sc").val(score);
}
});
//alert('ID: ' + this.id + "\nscore: " + score + "\nevent: " + evt);
$("#sc").val(score);
}
});
});
</script>
{pigcms{$shareScript}
</body>
</html>ajax_index.php页面
<html>
<head>
<title>测试1</title>
</head>
<body>
<volist name="news_list" id="vo">
<div style="background-color:white;width:96%;margin:0px auto;margin-top:5px;border-radius:5px;">
<a href="{pigcms{$vo['lianjie']}"><div class="title2" style="padding-left:10px;"><img style="width:10px;height:15px;padding-right:12px;" src="./tpl/Wap/static/images/new_my/title_left.png"/><font style="font-size:17px">{pigcms{$vo['title']}</font><br /></div></a>
<a href="{pigcms{$vo['lianjie']}"><div><img style="width:100%;" src="{pigcms{$vo['img4']}" /></div></a>
<div class="title1">{pigcms{$vo['introduction']}</div>
<div class="title3">
<div style="float:left;"><img class="sc" id="{pigcms{$vo['id']}" onClick="sc(this)" style="width:15px;height:15px;padding-left:0px;margin-left:0px;" src="./tpl/Wap/static/images/new_my/like.png"/> <font id="fav{pigcms{$vo.id}" color="#CCCCCC">{pigcms{$vo['fav']}</font> </div>
<div style="float:left; margin-left:40px;"> <div class="score" name="{pigcms{$vo['id']}" id="{pigcms{$vo['score']}"></div></div>
<div style="float:right;margin-right:20px"><a href="{pigcms{:U('Systemvoice/map2',array('id'=>$vo['id']))}"><img style="width:13px;height:13px" src="./tpl/Wap/static/images/new_my/ditudaohahng.png"/></a></div>
<div style="clear:both;"></div>
</div>
</div>
</volist>
<span>
<input type="hidden" id="ocount" value="{pigcms{$ocount}"/>
<input type="hidden" id="totalPage" value="{pigcms{$totalPage}"/>
</span>
<script>
$.fn.raty.defaults.path = 'http://www.97farm.com/tpl/Wap/bluesky/static/raty/images';
//$('.score').raty({readOnly: true,score:2.5});
$('.score').each(function(i,e){
var v = $(this).attr("id");
$(this).raty({score:v,
click: function(score, evt) {
var id = $(this).attr("name");
$.ajax({
type:"POST",
url:"{pigcms{:U('Systemvoice/pfajax')}",
data: {id:id,score:score},
cache:false, //不缓存此页面
success:function(data){
//$("#sc").val(score);
}
});
//alert('ID: ' + this.id + "\nscore: " + score + "\nevent: " + evt);
$("#sc").val(score);
}
});
});
$("body").unbind("click");
$("a").click(function(){
var href = $(this).attr("href");
window.location.href= href;
});
</script>
</body>
</html>
内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 
相关文章推荐
- Ajax实现列表无限加载和二级下拉选项效果
- 利用JS+Ajax实现下拉列表无刷联动，及其相关
- 常用js效果-toTop-加载中-下拉加载更多
- js实现上拉加载及下拉刷新效果
- 利用js将ajax获取到的后台数据动态加载至网页中的方法
- Pace.js – 超赞的页面加载进度自动指示和 Ajax 导航效果
- 利用ajax实现织梦dedecms瀑布流无限加载功能
- 利用autocomplete.js实现仿百度搜索效果（ajax动态获取后端[C#]数据）
- 利用JS实现简单的瀑布流加载图片效果
- 【Servlet】在Servlet3.0中利用ajax达到iframe局部刷新效果，同时避免在Js写过多的HTML代码
- 常用 ajax js 表单 下拉加载
- vue实现ajax滚动下拉加载，同时具有loading效果(推荐)
- thinkphp5.0+js 手机下拉加载更多
- 利用Dojo和JSON建立无限级AJAX动态加载的功能模块树
- 织梦dedecms首页列表页ajax点击下拉加载更多文章瀑布流效果
- vue实现ajax滚动下拉加载，同时具有loading效果
- 利用js将ajax获取到的后台数据动态加载至网页中
- 利用js将ajax获取到的后台数据动态加载至网页中
- ajax 下拉加载更多效果
- 页面的下拉加载效果基于ajax加载数据