JS 플러그 인 dropload 드 롭 다운 새로 고침,업 로드 사용 소결
8986 단어 dropload.js드 롭 다운 리 셋업 로드
<?php
header("Content-type: text/html; charset=utf-8");
include_once("./config.php");
//
$data = file_get_contents(URL."/interfaces/page.php?paging=1");
// echo $data;die;
$data = json_decode($data);
// var_dump($data);die;
?>
<!DOCTYPE html>
<html lang="zh-cn">
<head>
<meta name="viewport" content="initial-scale=1, user-scalable=0, minimal-ui" charset="UTF-8">
<title> 、 </title>
<!-- -->
<link rel="stylesheet" type="text/css" href="./css/display.css" rel="external nofollow" >
<!-- -->
<link rel="stylesheet" href="./css/dropload.css" rel="external nofollow" >
</head>
<body>
<div class="header">
<h1> </h1>
</div>
<div class="content">
<div class="lists">
<!-- lists -->
<?php for ($i=0; $i < count($data->data) ; $i++) { ?>
<a class="item" href="#" rel="external nofollow" >
<img src="./img/pic.jpg" alt="">
<h3>hehe</h3>
<span class="date"><?php echo $data->data[$i]->id; ?></span>
</a>
<?php } ?>
</div>
</div>
<div class="footer">
<a href="#1" rel="external nofollow" class="item"> </a>
<a href="#2" rel="external nofollow" class="item"> </a>
<a href="#3" rel="external nofollow" class="item"> </a>
<a href="#4" rel="external nofollow" class="item"> </a>
</div>
<!-- jQuery1.7 Zepto ， -->
<script src="./js/jquery.min.js"></script>
<script src="./js/dropload.min.js"></script>
<script>
$(function(){
var paging = 1;//
// dropload
$('.content').dropload({
scrollArea : window,
//
domUp : {
domClass : 'dropload-up',
//
domRefresh : '<div class="dropload-refresh">↓ - - </div>',
//
domUpdate : '<div class="dropload-update">↑ - </div>',
//
domLoad : '<div class="dropload-load"><span class="loading"></span> - ...</div>'
},
domDown : {
domClass : 'dropload-down',
//
domRefresh : '<div class="dropload-refresh">↑ - </div>',
//
domLoad : '<div class="dropload-load"><span class="loading"></span> - ...</div>',
// -
domNoData : '<div class="dropload-noData"> - </div>'
},
// 1 .
loadUpFn : function(me){
$.ajax({
type: 'GET',
//
url: './interfaces/page.php?paging=1',
dataType: 'json',
success: function(data){
// $.ajax() json ， json
// alert(typeof(data));
var result = '';
// DOM
// ， html() lists DOM
for(var i = 0; i < data.data.length; i++){
result += '<a class="item opacity" href="'+data.data[i].link+'" rel="external nofollow" rel="external nofollow" >'
+'<img src="'+data.data[i].pic+'" alt="">'
+'<h3>hehe</h3>'
+'<span class="date">'+data.data[i].id+'</span>'
+'</a>';
}
// ， 1
setTimeout(function(){
// html() DOM
$('.lists').html(result);
// ，
me.resetload();
},1000);
},
//
error: function(xhr, type){
alert('Ajax error!');
// ，
me.resetload();
}
});
},
// 2 .
loadDownFn : function(me){
paging++; // ， 1
$.ajax({
type: 'GET',
url: './interfaces/page.php?paging='+paging,
dataType: 'json',
success: function(data){
// data = JSON.parse(data);
var result = '';
// DOM
for(var i = 0; i < data.data.length; i++){
result += '<a class="item opacity" href="'+data.data[i].link+'" rel="external nofollow" rel="external nofollow" >'
+'<img src="'+data.data[i].pic+'" alt="">'
+'<h3>heheh</h3>'
+'<span class="date">'+data.data[i].id+'</span>'
+'</a>';
if(data.data.length<15){
//
//
me.lock();
//
me.noData();
break;
}
}
// ， 1
setTimeout(function(){
// DOM
$('.lists').append(result);
// ，
me.resetload();
},1000);
},
//
error: function(xhr, type){
alert('Ajax error!');
// ，
me.resetload();
}
});
},
threshold : 50 // ???
});
});
</script>
</body>
</html>
<?php
header("Content-type: text/html; charset=utf-8");
//
include_once('../config.php');
//
$paging = isset($_REQUEST['paging'])?$_REQUEST['paging']:'';
// $paging = 1;
$num = 15;//
$start_page = $num*($paging-1);//
//
$return = array();
$data = array();
/* mysqli */
// 1 .
$conn = new mysqli($servername,$username,$password,$database);
if ($conn->connect_error) {
die(" : ".$conn->connect_error);
}
// echo " ";
// （ ）
$conn->query("SET NAMES utf8");
// 2 .
$sql = "SELECT * FROM mission_news order by id desc limit $start_page , $num;";
// $sql = "SELECT * FROM mission_news order by id desc limit 0 , 15;";
// 3 .
$ret = $conn->query($sql);
// 4 .
if ($ret->num_rows > 0) {
while ($row = $ret->fetch_assoc()) { //
// var_dump($row);
// echo "id = ".$row['id']." mid = ".$row['mid']." context = ".$row['context']."<br>";
$tmp = array();//
$tmp['id'] = $row['id'];
$tmp['mid'] = $row['mid'];
$tmp['context'] = $row['context'];
$tmp['turn'] = $row['turn'];
$tmp['created'] = $row['created'];
//
$data[] = $tmp; //
}
//
$return['result'] = 1;
$return['data'] = $data;
}
// 5 .
$conn->close();
// 6 . json
echo json_encode($return);
?>좋은 웹페이지 즐겨찾기
