寒风网 http://www.coolwinds.cn ToMoRRow CoMes NeVer. Sat, 31 Mar 2012 04:30:40 +0000 en hourly 1 http://wordpress.org/?v=3.3.1 datatables高级应用之服务端处理数据 http://www.coolwinds.cn/article/design/1421.htm http://www.coolwinds.cn/article/design/1421.htm#comments Sat, 31 Mar 2012 04:30:40 +0000 寒风 http://www.coolwinds.cn/?p=1421 点击进入寒风网网站建设分类如果对datatables还不熟悉的童鞋，可以参考寒风的前两篇博文：
1. jquery分页插件datatables各参数详细说明及简单应用 2.datatables之ajax的应用
寒风在第一篇文章里面的结尾有个实例，但仅适用于数据量小的情况，数据量大了咋办呢？就需要在服务端处理数据了：]]> 如果对datatables还不熟悉的童鞋，可以参考寒风的前两篇博文：

1. jquery分页插件datatables各参数详细说明及简单应用

2.datatables之ajax的应用

寒风在第一篇文章里面的结尾有个实例，但仅适用于数据量小的情况，数据量大了咋办呢？就需要在服务端处理数据了：

http://www.datatables.net/release-datatables/examples/ajax/ajax.html

前端server.html：
核心代码：

1
2
3
4
5
6
7
8

$(document).ready(function() {
$('#example').dataTable( {
"bProcessing": true, //数据加载中的提示
"bServerSide": true, //开启服务端处理模式
"sAjaxSource": "server_mysqli.php" //ajax请求数据来源
//"sServerMethod": "GET" //修改默认传参方式
} );
} );

tbody里面不写，或者：

1
2
3

<tr>
    <td colspan="5" class="dataTables_empty">正在从服务器加载数据...</td>
</tr>

完整示例：
服务端server_mysqli.php改自datatables官方演示代码，不同之处是换成了mysqli，加了部分注释：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105

/* 部分公用变量 */
$aColumns = array( 'ID','time','num','times','deplet' ); //查询的字段
$sIndexColumn = "ID";  //count总数据用
$sTable = "table";  //查询的表单
 
/* 数据库连接 */
$mysqli=new mysqli("localhost","root","","database");
$mysqli->query("SET NAMES utf8");
 
/* 分页用，limit 【iDisplayStart,iDisplayLength】*/
$sLimit = "";
if ( isset( $_GET['iDisplayStart'] ) && $_GET['iDisplayLength'] != '-1' )
{
	$sLimit = "LIMIT ".mysql_real_escape_string( $_GET['iDisplayStart'] ).", ".
		mysql_real_escape_string( $_GET['iDisplayLength'] );//mysql_real_escape_string转义特殊字符
}
 
/* 排序用，order 【iSortingCols,iSortCol_*,sSortDir_*】*/
if ( isset( $_GET['iSortCol_0'] ) )
{
	$sOrder = "ORDER BY  ";
	for ( $i=0 ; $i<intval( $_GET['iSortingCols'] ) ; $i++ )//iSortingCols大于1时，多列排序时用，单列iSortingCols=1只有iSortCol_0和sSortDir_0
	{
		if ( $_GET[ 'bSortable_'.intval($_GET['iSortCol_'.$i]) ] == "true" )
		{
			$sOrder .= $aColumns[ intval( $_GET['iSortCol_'.$i] ) ]."
			 	".mysql_real_escape_string( $_GET['sSortDir_'.$i] ) .", ";  //iSortCol_*排序字段，sSortDir_*为DESC或ASC
		}
	}
	$sOrder = substr_replace( $sOrder, "", -2 );
	if ( $sOrder == "ORDER BY" )
	{
		$sOrder = "";
	}
}
 
/* 条件查询，顶部search过滤用 where .. like 【sSearch】*/
$sWhere = "";
if ( $_GET['sSearch'] != "" )
{
	$sWhere = "WHERE (";
	for ( $i=0 ; $i<count($aColumns) ; $i++ )
	{
		$sWhere .= $aColumns[$i]." LIKE '%".mysql_real_escape_string( $_GET['sSearch'] )."%' OR ";
	}
	$sWhere = substr_replace( $sWhere, "", -3 );
	$sWhere .= ')';
}
 
/* 各列过滤用 where .. like 【bSearchable_*,sSearch_*】 */
for ( $i=0 ; $i<count($aColumns) ; $i++ )
{
	if ( $_GET['bSearchable_'.$i] == "true" && $_GET['sSearch_'.$i] != '' ) //如果第i列开启了查询，且查询内容不为空
	{
		if ( $sWhere == "" )
		{
			$sWhere = "WHERE ";
		}
		else
		{
			$sWhere .= " AND ";
		}
		$sWhere .= $aColumns[$i]." LIKE '%".mysql_real_escape_string($_GET['sSearch_'.$i])."%' ";
	}
}
 
/* 数据查询，显示数据用 */
$sQuery = "
	SELECT SQL_CALC_FOUND_ROWS ".str_replace(" , ", " ", implode(", ", $aColumns))."
	FROM $sTable
	$sWhere
	$sOrder
	$sLimit
";
$rResult = $mysqli->query( $sQuery ) or die(mysql_error());
 
/* 获取过滤后的条数 */
$sQuery = "SELECT FOUND_ROWS()";
$rResultFilterTotal = $mysqli->query( $sQuery) or die(mysql_error());
$aResultFilterTotal = $rResultFilterTotal->fetch_array();
$iFilteredTotal = $aResultFilterTotal[0];
 
/* 获取数据总数 */
$sQuery = "SELECT COUNT(".$sIndexColumn.") FROM $sTable";
$rResultTotal = $mysqli->query( $sQuery ) or die(mysql_error());
$aResultTotal = $rResultTotal->fetch_array();
$iTotal = $aResultTotal[0];
 
/* 获取输出结果 */
$output = array(
	"sEcho" => intval($_GET['sEcho']),  //当前第多少条
	"iTotalRecords" => $iTotal,    //总计多少条
	"iTotalDisplayRecords" => $iFilteredTotal,   //过滤后多少条
	"aaData" => array()   //数据内容
);	
while ( $aRow = $rResult->fetch_array() )
{
	$row = array();
	for ( $i=0 ; $i<count($aColumns) ; $i++ )
	{
		$row[] = $aRow[ $aColumns[$i] ];
	}
	$output['aaData'][] = $row;
}
echo json_encode( $output );

其实也是通过ajax请求数据，只是在服务端做分页排序等等~

]]> http://www.coolwinds.cn/article/design/1421.htm/feed 6 datatables之ajax的应用 http://www.coolwinds.cn/article/design/1412.htm http://www.coolwinds.cn/article/design/1412.htm#comments Tue, 06 Mar 2012 09:01:42 +0000 寒风 http://www.coolwinds.cn/?p=1412 点击进入寒风网网站建设分类前面一篇文章jquery分页插件datatables各参数详细说明及简单应用寒风简单的介绍了一些datatables插件的参数设置，今天是他的ajax应用。 1. AjaxSource为本地文件（仅为值）,关键词：bProcessing,sAjaxSource,sAjaxDataProp http://www.datatables.net/release-datatables/examples/ajax/ajax.html 1> tbody留空 2> 
$(document).ready(function() {
    var oTable=$('#example').dataTable({
        "bProcessing": true,  //是否显示Processing，默认为false
        "sAjaxSource": "arrays.txt"  //这个不用解释了吧
        "sAjaxDataProp": "demo"  //默认json数据名为aaData，可通过sAjaxDataProp进行修改
    });
} );
arrays.txt的json数据格式如：http://www.datatables.net/release-datatables/examples/ajax/sources/arrays.txt，必须与列数对应，名为aaData 。 ]]> 点击进入寒风网网站建设分类前面一篇文章jquery分页插件datatables各参数详细说明及简单应用寒风简单的介绍了一些datatables插件的参数设置，今天是他的ajax应用。
1. AjaxSource为本地文件（仅为值）,关键词：bProcessing,sAjaxSource,sAjaxDataProp

http://www.datatables.net/release-datatables/examples/ajax/ajax.html

1> tbody留空
2>

1
2
3
4
5
6
7

$(document).ready(function() {
    var oTable=$('#example').dataTable({
        "bProcessing": true,  //是否显示Processing，默认为false
        "sAjaxSource": "arrays.txt"  //这个不用解释了吧
        "sAjaxDataProp": "demo"  //默认json数据名为aaData，可通过sAjaxDataProp进行修改
    });
} );

arrays.txt的json数据格式如：http://www.datatables.net/release-datatables/examples/ajax/sources/arrays.txt，必须与列数对应，名为aaData 。

2. AjaxSource带（数组），关键词：aoColumns

http://www.datatables.net/release-datatables/examples/ajax/objects.html

前端：

1
2
3
4
5
6
7

"aoColumns": [
            { "mDataProp": "engine" },
            { "mDataProp": "browser" },
            { "mDataProp": "platform" },
            { "mDataProp": "version" },
            { "mDataProp": "grade" }
        ]

请求所得数据类似：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31

{
  "aaData": [
    {
      "engine": "Trident",
      "browser": "Internet Explorer 4.0",
      "platform": "Win 95+",
      "version": "4",
      "grade": "X"
    },
    {
      "engine": "Trident",
      "browser": "Internet Explorer 5.0",
      "platform": "Win 95+",
      "version": "5",
      "grade": "C"
    },
    {
      "engine": "Trident",
      "browser": "Internet Explorer 5.5",
      "platform": "Win 95+",
      "version": "5.5",
      "grade": "A"
    },
    {
      "engine": "Trident",
      "browser": "Internet Explorer 6",
      "platform": "Win 98+",
      "version": "6",
      "grade": "A"
    }
]}

3. AjaxSource为向服务端请求的数据（仅为值）

http://www.datatables.net/release-datatables/examples/ajax/ajax.html

简单示例：
ajax.html:

1
2
3
4
5
6

	$(document).ready(function() {
	    var oTable=$('#example').dataTable({
			"bProcessing": true,
			"sAjaxSource": "ajax.php"
		});
	} );

ajax.php:

1
2
3
4
5
6
7
8
9
10
11
12
13
14

$mysqli=new mysqli("localhost","root","","database");
$mysqli->query("SET NAMES utf8");
$result=$mysqli->query("SELECT ID,time,num,times,deplet FROM `table` LIMIT 100");
if(!$result){
	echo "查询出错！";
	exit;
}
$str='{"aaData":[';//构建数据用
while($rows=$result->fetch_assoc()){
	$str.='["'.$rows['ID'].'","'.$rows['time'].'","'.$rows['num'].'","'.$rows['times'].'","'.$rows['deplet'].'"],';
}
$str.=']}';
$str=str_replace(',]}',']}',$str); //去掉最末端的逗号
echo $str;

4. 允许某列请求的数据有为空的数据，关键词：aoColumns

http://www.datatables.net/release-datatables/examples/ajax/null_data_source.html

1
2
3
4
5
6
7
8

"aoColumns": [
            null,
            null,
            null,
            null,
            null,
            { "mDataProp": null } //允许第六列为空
            ]

5. 数组里面包含子数组的情况，关键词：aoColumns

http://www.datatables.net/release-datatables/examples/ajax/objects_subarrays.html

请求得到的数据如：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30

{
  "aaData": [
    {
      "engine": "Trident",
      "browser": "Internet Explorer 4.0",
      "platform": "Win 95+",
      "details": [
        "4",
        "X"
      ]
    },
    {
      "engine": "Trident",
      "browser": "Internet Explorer 5.0",
      "platform": "Win 95+",
      "details": [
        "5",
        "C"
      ]
    },
    {
      "engine": "Trident",
      "browser": "Internet Explorer 5.5",
      "platform": "Win 95+",
      "details": [
        "5.5",
        "A"
      ]
    }
]}

前端代码：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17

"aoColumns": [
            { "mDataProp": "engine" },
            { "mDataProp": "browser" },
            { "mDataProp": "platform" },
            { "mDataProp": "details.0" },  //details里面的第一个值
            { "mDataProp": "details.1" }   //details里面的第二个值
        ]
/*
多级类似：
"aoColumns": [
            { "mDataProp": "engine" },
            { "mDataProp": "browser" },
            { "mDataProp": "platform.inner" },
            { "mDataProp": "platform.details.0" },
            { "mDataProp": "platform.details.1" }
            ]
*/
]]> http://www.coolwinds.cn/article/design/1412.htm/feed 0 jquery分页插件datatables各参数详细说明及简单应用 http://www.coolwinds.cn/article/design/1384.htm http://www.coolwinds.cn/article/design/1384.htm#comments Tue, 28 Feb 2012 11:37:38 +0000 寒风 http://www.coolwinds.cn/?p=1384 点击进入寒风网网站建设分类貌似很久没有更新博客了，实在太忙。。。 最近寒风用到一个jquery分页插件，刚拿到手时完全摸不着头脑，网上的中文资料几乎木有，于是花了点时间研究了一下，将以下分享出来，可以说是一个简单的datatables的中文手册了。可能文章会很长，但都是寒风一个字一个字打出来的，都经过实践了滴，嘿嘿~ 以下一些参数等基本是按照官方示例来的，比较多，还木有完全弄完，以后有机会再更新。
简介：Datatables是一款强大的jquery分页插件，不但具备分页功能，还可进行数据搜索过滤、排序等功能。 当前最新版本：v1.9.0 下载地址： http://www.datatables.net/download/ http://115.com/file/dp5u9szo
寒风提醒：下载后，将media文件夹里面的css，images，js文件夹拷贝到你的网站即可。接下来引入以下内容：
]]> 点击进入寒风网网站建设分类貌似很久没有更新博客了，实在太忙。。。
最近寒风用到一个jquery分页插件，刚拿到手时完全摸不着头脑，网上的中文资料几乎木有，于是花了点时间研究了一下，将以下分享出来，可以说是一个简单的datatables的中文手册了。可能文章会很长，但都是寒风一个字一个字打出来的，都经过实践了滴，嘿嘿~
以下一些参数等基本是按照官方示例来的，比较多，还木有完全弄完，以后有机会再更新。

简介：Datatables是一款强大的jquery分页插件，不但具备分页功能，还可进行数据搜索过滤、排序等功能。
当前最新版本：v1.9.0
下载地址：

http://www.datatables.net/download/

http://115.com/file/dp5u9szo

寒风提醒：下载后，将media文件夹里面的css，images，js文件夹拷贝到你的网站即可。接下来引入以下内容：

1
2
3
4
5
6
7
8
9
10
11

<style type="text/css" title="currentStyle">
	@import "./style/datatable/css/demo_page.css";
	@import "./style/datatable/css/demo_table.css";
</style>
<script type="text/javascript" src="./style/datatable/js/jquery.js"></script>
<script type="text/javascript" src="./style/datatable/js/jquery.dataTables.min.js"></script>
<script type="text/javascript">
	$(document).ready(function() {
	    $('#example').dataTable();//其中example为table的id，table中必须有thead！
	} );
</script>

1. datatables简单示例

http://www.datatables.net/release-datatables/examples/basic_init/zero_config.html

1
2
3

$(document).ready(function() {
$('#example').dataTable();
} );

这个是不进行参数配置，效果如下图：

2. 进行基本参数配置

http://www.datatables.net/release-datatables/examples/basic_init/filter_only.html

1
2
3
4
5
6

"bPaginate": true, //翻页功能
"bLengthChange": true, //改变每页显示数据数量
"bFilter": true, //过滤功能
"bSort": true, //排序功能
"bInfo": true,//页脚信息
"bAutoWidth": true,//自动宽度

寒风说明：以上参数配置实现的显示效果和第一个是一样的。
3. 默认排序设置，aaSorting

http://www.datatables.net/release-datatables/examples/basic_init/table_sorting.html

1

"aaSorting": [[ 4, "desc" ]],//设置第5个元素为默认排序

4. 多个datatable

http://www.datatables.net/release-datatables/examples/basic_init/multiple_tables.html

寒风说明：
将表单id改为class：
初始化：

1

$('.example').dataTable(

即可。
5. 隐藏部分列的内容，aoColumnDefs

http://www.datatables.net/release-datatables/examples/basic_init/hidden_columns.html

1
2
3
4

"aoColumnDefs": [
{ "bSearchable": false, "bVisible": false, "aTargets": [ 2 ] },//bSearchable：是否可搜索；bVisible：是否可见；aTargets：哪一列
{ "bVisible": false, "aTargets": [ 3 ] }//
]

6. 修改表单各元素显示位置

http://www.datatables.net/release-datatables/examples/basic_init/dom.html

1

"sDom": '<"top"i>rt<"bottom"flp><"clear">'

表示的html为：

1
2
3
4
5
6
7
8
9
10
11
12
13

<div class="top">这里显示 当前条数，总共条数</div>
这里显示 请求中的提示信息，表单内容
<div class="bottom">这里显示 搜索框，每页数量选择，翻页按钮</div>
<div class="clear"></div>
 
//l - 每页数量选择select
//f – 搜索框search
//t – 表单内容table
//i – 当前条数，总共条数information
//p – 翻页按钮pagination
//r – 请求中的提示信息
//< 和 > – 一个div的开始与结束
//<"class"> – class为div的class名称

7. 保存当前页面信息为cookie，默认关闭

http://www.datatables.net/release-datatables/examples/basic_init/state_save.html

1

"bStateSave": true

如果用户关闭页面后重新打开该页面，该列表会和关闭前的状态完全一样（长度，过滤，分页和排序）

8. 修改默认分页显示样式

http://www.datatables.net/release-datatables/examples/basic_init/alt_pagination.html

1

"sPaginationType": "full_numbers"

9. x轴宽度限制

http://www.datatables.net/release-datatables/examples/basic_init/scroll_x.html

1
2
3

"sScrollX": "100%",
"sScrollXInner": "110%",
"bScrollCollapse": true

用的很少

10. y轴高度限制

http://www.datatables.net/release-datatables/examples/basic_init/scroll_y.html

1
2

"sScrollY": "200px",
"bPaginate": false //该参数为是否显示分页，如果设置为true貌似就没什么意义了

11. x轴、y轴均限制

http://www.datatables.net/release-datatables/examples/basic_init/scroll_xy.html

1
2
3

"sScrollY": 200,
"sScrollX": "100%",
"sScrollXInner": "110%"

12. 应用主题

http://www.datatables.net/release-datatables/examples/basic_init/themes.html

需要拷贝examples/examples_support/themes文件夹到style/datatable里面

1

@import "./style/datatable/css/demo_table.css";

替换为：

1
2
3

@import "./style/datatable/css/demo_table_jui.css";
主题一：
引入<pre lang="html" line="1">@import "./style/datatable/themes/smoothness/jquery-ui-1.8.4.custom.css";


主题二：
引入

1

@import "./style/datatable/themes/ui-lightness/jquery-ui-1.8.4.custom.css";

主题二是橘色系的，木有第一个smoothness好看，这里就不截图了！

13. 语言设置

http://www.datatables.net/release-datatables/examples/basic_init/language.html

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15

"oLanguage": {
"sLengthMenu": "每页显示 _MENU_条",
"sZeroRecords": "没有找到符合条件的数据",
"sProcessing": "&lt;img src=’./loading.gif’ /&gt;",
"sInfo": "当前第 _START_ - _END_ 条　共计 _TOTAL_ 条",
"sInfoEmpty": "木有记录",
"sInfoFiltered": "(从 _MAX_ 条记录中过滤)",
"sSearch": "搜索：",
"oPaginate": {
"sFirst": "首页",
"sPrevious": "前一页",
"sNext": "后一页",
"sLast": "尾页"
}
}

也可以直接指定语言包，txt文件：

1

"sUrl": "media/language/de_DE.txt" //文件格式和上面一样

14. 各列数据input过滤

http://www.datatables.net/release-datatables/examples/api/multi_filter.html

最前面加入：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24

var asInitVals = new Array();
$('#example').dataTable 修改为：var oTable =$('#example').dataTable
加入：
/*过滤代码开始*/
$("tfoot input").keyup( function () {
oTable.fnFilter( this.value, $("tfoot input").index(this) );
} );
$("tfoot input").each( function (i) {
asInitVals[i] = this.value;
} );
$("tfoot input").focus( function () {
if ( this.className == "search_init" )
{
this.className = "";
this.value = "";
}
} );
$("tfoot input").blur( function (i) {
if ( this.value == "" )
{
this.className = "search_init";
this.value = asInitVals[$("tfoot input").index(this)];
}
} );

tfoot里面加入：

1
2
3
4
5
6
7

<tr>
    <th><input type="text" name="search_engine" value="Search engines" class="search_init" /></th>
    <th><input type="text" name="search_browser" value="Search browsers" class="search_init" /></th>
    <th><input type="text" name="search_platform" value="Search platforms" class="search_init" /></th>
    <th><input type="text" name="search_version" value="Search versions" class="search_init" /></th>
    <th><input type="text" name="search_grade" value="Search grades" class="search_init" /></th>
</tr>

15. 每一行点击详情效果

http://www.datatables.net/release-datatables/examples/api/row_details.html

在最前面引入函数：

1
2
3
4
5
6
7
8
9
10

/* 构造每一行详情的函数 fnFormatDetails*/
function fnFormatDetails ( oTable, nTr ){
    var aData = oTable.fnGetData( nTr );
    var sOut = '<table cellpadding="6" cellspacing="0" border="0" style="padding-left:50px;">'; //在这里定义要返回的内容
    sOut += '<tr><td>Rendering engine:</td><td>'+aData[1]+' '+aData[4]+'</td></tr>';
    sOut += '<tr><td>Link to source:</td><td>Could provide a link here</td></tr>';
    sOut += '<tr><td>Extra info:</td><td>And any further details here (images etc)</td></tr>';
    sOut += '</table>';
    return sOut;
}

ready(function)里面开头加入：

1
2
3
4
5
6
7
8
9
10
11
12

/*显示每一行详情用_start*/
var nCloneTh = document.createElement( 'th' );
var nCloneTd = document.createElement( 'td' );
nCloneTd.innerHTML = '<img src="./style/datatable/images/details_open.png">';
nCloneTd.className = "center";
$('#example thead tr').each( function () {
    this.insertBefore( nCloneTh, this.childNodes[0] );
} );
$('#example tbody tr').each( function () {
    this.insertBefore(  nCloneTd.cloneNode( true ), this.childNodes[0] );
} );
/*显示每一行详情用_end*/

ready(function)里面末尾加入：

1
2
3
4
5
6
7
8
9
10
11
12
13
14

/*加入展开，收缩每一行详情按钮用*/
$('#example tbody td img').live('click', function () {
    var nTr = $(this).parents('tr')[0];
    if ( oTable.fnIsOpen(nTr) )
    {
        this.src = "./style/datatable/images/details_open.png";
        oTable.fnClose( nTr );
    }
    else
    {
        this.src = "./style/datatable/images/details_close.png";
        oTable.fnOpen( nTr, fnFormatDetails(oTable, nTr), 'details' );
    }
} );

值得注意的是，如果加入了tfoot，必须手动在里面加入多一行th！

最后，是寒风写的简单的php+mysql+datatables的简单示例，很多寒风都做了详细的注释说明：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184

<?php 
$mysqli=new mysqli("localhost","root","","database");
$mysqli->query("SET NAMES utf8");
 
$result=$mysqli->query("SELECT * FROM `table` limit 500");
if(!$result){
	echo "查询出错！";
	exit;
}
?>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css" title="currentStyle">
	@import "./style/datatable/css/demo_page.css";
	@import "./style/datatable/css/demo_table_jui.css";
	@import "./style/datatable/themes/smoothness/jquery-ui-1.8.4.custom.css";
	body{ font-size:12px;}
	table{ font-size:12px;}
</style>
<script type="text/javascript" src="./style/datatable/js/jquery.js"></script>
<script type="text/javascript" src="./style/datatable/js/jquery.dataTables.min.js"></script>
 
<script type="text/javascript">
	/* 构造每一行详情的函数 fnFormatDetails*/
	function fnFormatDetails ( oTable, nTr ){
		var aData = oTable.fnGetData( nTr );
		var sOut = '<table cellpadding="6" cellspacing="0" border="0" style="padding-left:50px;">'; //在这里定义要返回的内容
		sOut += '<tr><td>Rendering engine:</td><td>'+aData[1]+' '+aData[4]+'</td></tr>';
		sOut += '<tr><td>Link to source:</td><td>Could provide a link here</td></tr>';
		sOut += '<tr><td>Extra info:</td><td>And any further details here (images etc)</td></tr>';
		sOut += '</table>';
		return sOut;
	}
 
	/*页面元素加载完成后开始执行*/
	$(document).ready(function() {
		/*显示每一行详情用_start*/
		var nCloneTh = document.createElement( 'th' );
		var nCloneTd = document.createElement( 'td' );
		nCloneTd.innerHTML = '<img src="./style/datatable/images/details_open.png">';
		nCloneTd.className = "center";
		$('#example thead tr').each( function () {
			this.insertBefore( nCloneTh, this.childNodes[0] );
		} );
		$('#example tbody tr').each( function () {
			this.insertBefore(  nCloneTd.cloneNode( true ), this.childNodes[0] );
		} );
		/*显示每一行详情用_end*/
 
		var asInitVals = new Array(); //用于每一列搜索过滤
	    var oTable =$('#example').dataTable( //var oTable用于每一列搜索过滤
	    	{
				/*基本参数设置，以下参数设置和默认效果一致*/
	    		"bPaginate": true, //翻页功能
	    		"bLengthChange": true, //改变每页显示数据数量
	    		"bFilter": true, //过滤功能
	    		"bSort": true, //排序功能
	    		"bInfo": true,//页脚信息
	    		"bAutoWidth": true,//自动宽度
	    		/*默认排序设置*/
	    		"aaSorting": [[ 4, "desc" ]],//设置第5个元素为默认排序
                /*默认翻页样式设置*/
	    		"sPaginationType": "full_numbers",
	    		/*是否开启主题*/
	    		"bJQueryUI": true,
				/*语言设置*/
	            "oLanguage": {
	                "sLengthMenu": "每页显示 _MENU_条",
	                "sZeroRecords": "没有找到符合条件的数据",
	                "sProcessing": "<img src=’./loading.gif’ />",
	                "sInfo": "当前第 _START_ - _END_ 条　共计 _TOTAL_ 条",
	                "sInfoEmpty": "木有记录",
	                "sInfoFiltered": "(从 _MAX_ 条记录中过滤)",
	                "sSearch": "搜索：",
                	"oPaginate": {
    	            	"sFirst": "首页",
    	            	"sPrevious": "前一页",
    	            	"sNext": "后一页",
    	            	"sLast": "尾页"
    		        }
	            }
			}
	    );
 
		/*每一列搜索过滤代码开始*/
	    $("tfoot input").keyup( function () {
	        oTable.fnFilter( this.value, $("tfoot input").index(this) );
	    } );
	    $("tfoot input").each( function (i) {
	        asInitVals[i] = this.value;
	    } );
	    $("tfoot input").focus( function () {
	        if ( this.className == "search_init" )
	        {
	            this.className = "";
	            this.value = "";
	        }
	    } );
	    $("tfoot input").blur( function (i) {
	        if ( this.value == "" )
	        {
	            this.className = "search_init";
	            this.value = asInitVals[$("tfoot input").index(this)];
	        }
	    } );
 
		/*加入展开，收缩每一行详情按钮用*/
		$('#example tbody td img').live('click', function () {
			var nTr = $(this).parents('tr')[0];
			if ( oTable.fnIsOpen(nTr) )
			{
				this.src = "./style/datatable/images/details_open.png";
				oTable.fnClose( nTr );
			}
			else
			{
				this.src = "./style/datatable/images/details_close.png";
				oTable.fnOpen( nTr, fnFormatDetails(oTable, nTr), 'details' );
			}
		} );
	} );
</script>
</head>
 
<body>
<div style=" width:800px; margin:0 auto;">
<table cellpadding="0" cellspacing="0" class="display" border="0" id="example">
<thead>
  <tr>
    <th>ID</th>
    <th>时间</th>
    <th>数量</th>
    <th>次数</th>
    <th>消耗</th>
  </tr>
</thead>
<tbody>
<?php
while($rows=$result->fetch_assoc()){
	$rows['time']=date("Y-m-d H:i:s",$rows['time']);
	echo "
	<tr>
	  <td>{$rows['ID']}</td>
	  <td>{$rows['time']}</td>
	  <td>{$rows['r_num']}</td>
	  <td>{$rows['r_times']}</td>
	  <td>{$rows['money']}</td>
	</tr>";
}
?>
</tbody>
<tfoot>
  <tr>
    <th></th>
    <th>ID</th>
    <th>时间</th>
    <th>数量</th>
    <th>次数</th>
    <th>消耗</th>
  </tr>
	<tr>
		<th></th>
		<th><input type="text" name="search_engine" value="Search engines" class="search_init" /></th>
		<th><input type="text" name="search_browser" value="Search browsers" class="search_init" /></th>
		<th><input type="text" name="search_platform" value="Search platforms" class="search_init" /></th>
		<th><input type="text" name="search_version" value="Search versions" class="search_init" /></th>
		<th><input type="text" name="search_grade" value="Search grades" class="search_init" /></th>
	</tr>
</tfoot>
</table>
<style>
#example tr.even:hover {background-color: #ECFFB3;}
#example tr.even:hover td.sorting_1 {background-color: #DDFF75;}
#example tr.even:hover td.sorting_2 {background-color: #E7FF9E;}
#example tr.even:hove3 {background-color: #E2FF89;}
#example tr.odd:hover {background-color: #E6FF99;}
#example tr.odd:hover td.sorting_1 {background-color: #D6FF5C;}
#example tr.odd:hover td.sorting_2 {background-color: #E0FF84;}
#example tr.odd:hover td.sorting_3 {background-color: #DBFF70;}
</style>
</div>
</body>
</html>

实现了上面绝大部分功能！以上php+datatables示例仅适用于数据量少时的情况，数据量大的情况寒风以后再专门写博文~
最终效果图如下：

]]> http://www.coolwinds.cn/article/design/1384.htm/feed 3 教你快速找出一听(1ting)音乐网的歌曲真实地址 http://www.coolwinds.cn/article/pc/1376.htm http://www.coolwinds.cn/article/pc/1376.htm#comments Tue, 17 Jan 2012 08:57:28 +0000 寒风 http://www.coolwinds.cn/?p=1376 点击进入寒风网电脑常识分类一听音乐网的确是个很不错的音乐网站，之前还有一听音乐电台的，貌似被河蟹掉了？ 有时候在一听上听到一首好听的歌曲，想下下来才发现： 提示要下载一听音乐盒才能下载，有木有办法不下载一听音乐盒就能下载歌曲呢？寒风接下来就教你快速找出一听(1ting)音乐网的歌曲真实地址。 以chrome浏览器为例，当然神马世界之窗极速版，枫树，360极速版等以chrome为内核的浏览器都是可以的（其他带开发人员工具的浏览器也行，例如firefox），在歌曲播放页面右击选择审查元素。 ]]> 点击进入寒风网电脑常识分类一听音乐网的确是个很不错的音乐网站，之前还有一听音乐电台的，貌似被河蟹掉了？

有时候在一听上听到一首好听的歌曲，想下下来才发现：

提示要下载一听音乐盒才能下载，有木有办法不下载一听音乐盒就能下载歌曲呢？寒风接下来就教你快速找出一听(1ting)音乐网的歌曲真实地址。

以chrome浏览器为例，当然神马世界之窗极速版，枫树，360极速版等以chrome为内核的浏览器都是可以的（其他带开发人员工具的浏览器也行，例如firefox），在歌曲播放页面右击选择审查元素。

看看源代码，看我们发现了神马？我们发现了一听的歌曲真实地址了：

接下来，在歌曲地址那里右击选择“Edit attribute”：

然后复制该地址到迅雷里面下载就可以了

如果你没有使用寒风上面所说的浏览器，甚至你还在使用万恶的ie6？

木有关系，接下来寒风教你其他方法，在播放页面右击选择查看源代码，按Ctrl+F，输入wma查找：

答疑：为什么要搜wma？

a. 因为通过我多年的观察，一听的歌基本都是wma的，原因其实很简单，同样音质的歌曲wma比mp3体积小。如果wma搜不到，尝试一下mp3。

看到这个了么？

\/zzzzzmp3\/2011lDec\/28L\/28zhangnl\/01.wma

这个就是歌曲的播放地址了，加了反斜杠转义了一下，去掉就行了：

/zzzzzmp3/2011lDec/28L/28zhangnl/01.wma

然后在这个地址前面加入http://nonie.1ting.com:9092

答疑：为什么前面要加入http://nonie.1ting.com:9092?

a. 寒风发现一听网的歌都是这个地址 

补全后，地址就是http://nonie.1ting.com:9092/zzzzzmp3/2011lDec/28L/28zhangnl/01.wma

然后同样，复制这个地址到迅雷里面下载就行了。

  • 暂无相关日志
]]> http://www.coolwinds.cn/article/pc/1376.htm/feed 6 小巧的mysql数据库php管理工具phpMiniAdmin 1.7.111025寒风汉化版 http://www.coolwinds.cn/article/free/1367.htm http://www.coolwinds.cn/article/free/1367.htm#comments Sat, 24 Dec 2011 15:29:49 +0000 寒风 http://www.coolwinds.cn/?p=1367 点击进入寒风网免费资源分类今天推荐个工具，是前些天无意中发现的一个mysql管理工具，名为phpMiniAdmin，最新版本号为：1.7.111025。可惜的是只有英文版本，于是自己抽空汉化了一下。 该工具有以下特点：
1. 仅一个php文件，体积小，使用方便； 2. 可执行mysql语句； 3. 可进行一些简单的可视化数据库操作； 4. 具有数据库备份还原功能； 5. 可设置密码，确保网站数据安全。
以下是寒风汉化后的截图：

]]> 点击进入寒风网免费资源分类今天推荐个工具，是前些天无意中发现的一个mysql管理工具，名为phpMiniAdmin，最新版本号为：1.7.111025。可惜的是只有英文版本，于是自己抽空汉化了一下。

该工具有以下特点：

1. 仅一个php文件，体积小，使用方便；

2. 可执行mysql语句；

3. 可进行一些简单的可视化数据库操作；

4. 具有数据库备份还原功能；

5. 可设置密码，确保网站数据安全。

以下是寒风汉化后的截图：

填写数据库连接信息

连接数据库成功后的界面

简单数据库可视化管理

体积小巧，功能强大，绝对是值得收藏的一个php小工具！

最后是下载地址：

下载地址1

备用下载地址2

寒风提醒：

* 压缩包内包含两个文件，一个phpMiniAdmin.php为官方原版，phpMiniAdminCN.php为寒风汉化的版本。

* 设置密码请打开文件，修改第11行$ACCESS_PWD=”;填写你要的密码即可！据寒风所测，本地使用时，填写了密码会有点小错。

]]> http://www.coolwinds.cn/article/free/1367.htm/feed 4 替换dedeeims的编辑器，增加dede批量图片上传功能 http://www.coolwinds.cn/article/design/1360.htm http://www.coolwinds.cn/article/design/1360.htm#comments Sat, 10 Dec 2011 14:05:33 +0000 寒风 http://www.coolwinds.cn/?p=1360 点击进入寒风网网站建设分类今天突然发现dedecms有个比较大的更新，主站和论坛都挂出来了，版本号为5.7sp1。其中的一个更新让我眼前一亮，那就是批量上传图片功能 可能大家知道，dede以前就有批量上传，但只有图集里面有，dedeeims里面也有，是在产品图片里面。使用的是swfupload，但没有与编辑器整合 今天下载这个v5.7sp1本地调试后发现还不错，有两个问题：
1. 按钮提示文字和链接的中文字都是乱码，看了一下对应文件编码，为gb2312（下载的为utf-8）。总感觉织梦每次更新都有一些没做好的细节。 2.测试了上传没问题，但批量上传突破后插入图片到编辑器和删除图片居然只支持ie系列浏览器！！！-_-||| 狂汗！
]]> 点击进入寒风网网站建设分类今天寒风突然发现dedecms有个比较大的更新，主站和论坛都挂出来了，版本号为5.7sp1。其中的一个更新让我眼前一亮，那就是批量上传图片功能

可能大家知道，dede以前就有批量上传，但只有图集里面有，dedeeims里面也有，是在产品图片里面。使用的是swfupload，但没有与编辑器整合

今天下载这个v5.7sp1本地调试后发现还不错，有两个问题：

1. 按钮提示文字和链接的中文字都是乱码，看了一下对应文件编码，为gb2312（下载的为utf-8）。总感觉织梦每次更新都有一些没做好的细节。

2.测试了上传没问题，但批量上传突破后插入图片到编辑器和删除图片居然只支持ie系列浏览器！！！-_-||| 狂汗！

先搁置这两个问题，研究了一下怎么把织梦的这个新功能移植到dedeeims，以下贴出详细方法：

1. 后台核心设置，Html编辑器选项（目前仅支持fck）：改为ckeditor；

2. 复制dede5.7sp1里面的include/ckeditor文件夹到dedeeims的include文件夹；

3. 修改include/inc/inc_fun_funAdmin.php文件， 替换函数SpGetEditor：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100

function SpGetEditor($fname,$fvalue,$nheight="350",$etype="Basic",$gtype="print",$isfullpage="false",$bbcode=false)
{
    global $cfg_ckeditor_initialized;
    if(!isset($GLOBALS['cfg_html_editor']))
    {
        $GLOBALS['cfg_html_editor']='fck';
    }
    if($gtype=="")
    {
        $gtype = "print";
    }
    if($GLOBALS['cfg_html_editor']=='fck')
    {
        require_once(DEDEINC.'/FCKeditor/fckeditor.php');
        $fck = new FCKeditor($fname);
        $fck->BasePath        = $GLOBALS['cfg_cmspath'].'/include/FCKeditor/' ;
        $fck->Width        = '100%' ;
        $fck->Height        = $nheight ;
        $fck->ToolbarSet    = $etype ;
        $fck->Config['FullPage'] = $isfullpage;
        if($GLOBALS['cfg_fck_xhtml']=='Y')
        {
            $fck->Config['EnableXHTML'] = 'true';
            $fck->Config['EnableSourceXHTML'] = 'true';
        }
        $fck->Value = $fvalue ;
        if($gtype=="print")
        {
            $fck->Create();
        }
        else
        {
            return $fck->CreateHtml();
        }
    }
    else if($GLOBALS['cfg_html_editor']=='ckeditor')
    {
        require_once(DEDEINC.'/ckeditor/ckeditor.php');
        $CKEditor = new CKEditor();
        $CKEditor->basePath = $GLOBALS['cfg_cmspath'].'/include/ckeditor/' ;
        $config = $events = array();
        $config['extraPlugins'] = 'dedepage,multipic,addon';
		if($bbcode)
		{
			$CKEditor->initialized = true;
			$config['extraPlugins'] .= ',bbcode';
			$config['fontSize_sizes'] = '30/30%;50/50%;100/100%;120/120%;150/150%;200/200%;300/300%';
			$config['disableObjectResizing'] = 'true';
			$config['smiley_path'] = $GLOBALS['cfg_cmspath'].'/images/smiley/';
			// 获取表情信息
			require_once(DEDEDATA.'/smiley.data.php');
			$jsscript = array();
			foreach($GLOBALS['cfg_smileys'] as $key=>$val)
			{
				$config['smiley_images'][] = $val[0];
				$config['smiley_descriptions'][] = $val[3];
				$jsscript[] = '"'.$val[3].'":"'.$key.'"';
			}
			$jsscript = implode(',', $jsscript);
			echo jsScript('CKEDITOR.config.ubb_smiley = {'.$jsscript.'}');
		}
 
        $GLOBALS['tools'] = empty($toolbar[$etype])? $GLOBALS['tools'] : $toolbar[$etype] ;
        $config['toolbar'] = $GLOBALS['tools'];
        $config['height'] = $nheight;
        $config['skin'] = 'kama';
        $CKEditor->returnOutput = TRUE;
        $code = $CKEditor->editor($fname, $fvalue, $config, $events);
        if($gtype=="print")
        {
            echo $code;
        }
        else
        {
            return $code;
        }
    }
    else { 
        /*
        // ------------------------------------------------------------------------
        // 当前版本,暂时取消dedehtml编辑器的支持
        // ------------------------------------------------------------------------
        require_once(DEDEINC.'/htmledit/dede_editor.php');
        $ded = new DedeEditor($fname);
        $ded->BasePath        = $GLOBALS['cfg_cmspath'].'/include/htmledit/' ;
        $ded->Width        = '100%' ;
        $ded->Height        = $nheight ;
        $ded->ToolbarSet = strtolower($etype);
        $ded->Value = $fvalue ;
        if($gtype=="print")
        {
            $ded->Create();
        }
        else
        {
            return $ded->CreateHtml();
        }
        */
    }
}

4. 后台dede/templets/article_add,article_edit模版文件，加入：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19

<style type="text/css">
<!--
body { background-image: url(images/allbg.gif); }
.multipic {
	border: 1px dashed #FC6;
}
.albCt {
	border-bottom: 1px dashed #FC0;
	margin-bottom: 10px;
	padding-bottom:10px;
}
.albCt img{
	cursor:pointer;
}
-->
</style>
<script type="text/javascript" src="../images/swfupload/swfupload.js"></script>
<script type="text/javascript"src="js/handlers.js"></script>
<script type="text/javascript" src="js/calendar/calendar.js"></script>

5. 后台dede/templets/article_add,article_edit里面的js改成：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103

<script language="javascript">
<!--
var swfu = null;
var arctype = 'article';
function checkSubmit()
{
	if(document.form1.title.value==""){
		alert("文章标题不能为空！");
		return false;
	}
	if(document.form1.typeid.value==0){//article_edit.htm可以不加这个判断
		alert("请选择档案的主类别！");
		return false;
	}
}
window.onload = function ()
{
	swfu = new SWFUpload(
	{
		// Backend Settings
		upload_url: "swfupload.php",
		post_params: {"PHPSESSID": "<?php echo session_id(); ?>", "dopost" : "", "arctype" : arctype},
 
		// File Upload Settings
		file_size_limit : "2 MB",	// 2MB
		file_types : "*.jpg; *.gif; *.png",
		file_types_description : "选择 JPEG/GIF/PNG 格式图片",
		file_upload_limit : "0",
 
		file_queue_error_handler : fileQueueError,
		file_dialog_complete_handler : fileDialogComplete,
		upload_progress_handler : uploadProgress,
		upload_error_handler : uploadError,
		upload_success_handler : uploadSuccess,
		upload_complete_handler : uploadComplete,
 
		button_image_url : "../images/SmallSpyGlassWithTransperancy_17x18.png",
		button_placeholder_id : "spanButtonPlaceholder",
		button_width: '100%',
		button_height: 26,
		button_text : '<div class="button" style="background-color:#E5F1CF; height:26px; text-align:center; line-height:26px">上传图片(可多选)</div>',
		button_text_style : '',
		button_text_top_padding: 0,
		button_text_left_padding: 10,
		button_window_mode: SWFUpload.WINDOW_MODE.TRANSPARENT,
		button_cursor: SWFUpload.CURSOR.HAND,
 
		// Flash Settings
		flash_url : "../images/swfupload/swfupload.swf",
 
		custom_settings : {
			upload_target : "divFileProgressContainer"
		},
 
		// Debug Settings
		debug: false
	});
};
 
function addtoEdit(pid)
{
	jQuery.get('swfupload.php?dopost=addtoedit&id=' + pid, function(data)
	{
		var picTitle = jQuery('input[name="picinfook'+pid+'"]').val();
		var picHTML = '<img src="'+data+'" alt="'+picTitle+'"/>';
		CKEDITOR.instances.body.insertHtml(picHTML);
	});
}
 
//删除已经上传的图片
function delAlbPic(pid){
	// 同步删除编辑器中插入的图片
	jQuery("#__tmpbody").html();
	jQuery.get('swfupload.php?dopost=addtoedit&id=' + pid, function(data)
	{
		var iptbody = CKEDITOR.instances.body.getData();
		jQuery("#__tmpbody").html(iptbody);
		jQuery("#__tmpbody").find('img').each(function()
		{
			if(jQuery(this).attr('src') == data)
			{
				//alert(data);
				jQuery(this).remove();
			}
		});
		CKEDITOR.instances.body.setData(jQuery("#__tmpbody").html()); 
		jQuery("#__tmpbody").html();
		var tgobj = $Obj('albCtok'+pid);
		var myajax = new DedeAjax(tgobj);
		myajax.SendGet2('swfupload.php?dopost=del&id='+pid);
		$Obj('thumbnails').removeChild(tgobj);
	});
}
 
//删除已经上传的图片(编辑时用)
function delAlbPicOld(picfile, pid){
	var tgobj = $Obj('albold'+pid);
	var myajax = new DedeAjax(tgobj);
	myajax.SendGet2('swfupload.php?dopost=delold&picfile='+picfile);
	$Obj('thumbnailsEdit').removeChild(tgobj);
}
-->
</script>

6. 后台dede/templets/article_add.htm,article_edit.htm,编辑器调用 格右边加入:

1
2
3
4
5
6
7

      <td width="255" align="center" valign="top" bgcolor="#FFFFCC" id="mPic" style="display:none"><div class="multipic">
      <div style="display: block;background-color:#E5F1CF; height:26px">
								<span id="spanButtonPlaceholder"></span>
	  </div>
      <div id="divFileProgressContainer"></div>
      <div id="thumbnails" style="width: 254px; height: 535px; background-color: rgb(255, 255, 255); overflow-y: scroll;"></div>
      </div></td>

7. 拷贝v5.7sp1的dede/js/calendar文件夹到dedeeims的dede/js/

8. 替换dedeeims的dede/swfupload.php为v5.7sp1的

9. 替换dedeeims的include/dialog文件夹为v5.7sp1的

步骤很麻烦，修改比较多，但绝对有效果的，寒风还做了个安装版的，具体效果图这台电脑上木有，下次修改文章补上，顺便把所有修改了的文件打包发上来，嘿嘿~

兼容bug已经反馈到织梦论坛，现在寒风坐等织梦更新，再跟进

]]> http://www.coolwinds.cn/article/design/1360.htm/feed 1 今天的成果，php邮件订阅功能 http://www.coolwinds.cn/article/design/1353.htm http://www.coolwinds.cn/article/design/1353.htm#comments Fri, 09 Dec 2011 10:33:48 +0000 寒风 http://www.coolwinds.cn/?p=1353 点击进入寒风网网站建设分类每天对着电脑，头晕脑胀！ 贴一下今天的成果，虽然是个很简单的东西，但自己写出来还是很有成就感的说，嘿嘿~ 主要实现的是邮件订阅功能，用户可以在前台输入email加入订阅名单，或者取消订阅 后台则是通过手动发送邮件来发送订阅信息，支持邮件群发！ 首先是前台： ]]> 点击进入寒风网网站建设分类每天对着电脑，头晕脑胀！

贴一下今天的成果，虽然是个很简单的东西，但自己写出来还是很有成就感的说，嘿嘿~

主要实现的是邮件订阅功能，用户可以在前台输入email加入订阅名单，或者取消订阅

后台则是通过手动发送邮件来发送订阅信息，支持邮件群发！

首先是前台：

前台页面未做任何美化，今天主要实现功能而已！

后台：

我的一贯风格！嘿嘿，和那个ip屏蔽后台样式一样！简洁就好！

当然后续还可以加入更多功能，可以慢慢完善，这个也可以当作一个纯粹的邮件群发工具。

这次代码就先不贴出来了

结个尾，准备挤公交去了~

]]> http://www.coolwinds.cn/article/design/1353.htm/feed 4 Hey men, this is my website! Go away! http://www.coolwinds.cn/article/life/1347.htm http://www.coolwinds.cn/article/life/1347.htm#comments Tue, 22 Nov 2011 04:43:56 +0000 寒风 http://www.coolwinds.cn/?p=1347 点击进入我的生活分类！由于实在太忙，都没时间去更新网站了！ 前几天打开网站一看，一篇文章都没了，貌似被删了，当时傻眼了，好久没备份了。 打开后台看了一下，文章全没了，评论还在。 还好后来联系了老薛客服，帮忙恢复了数据。 今天才有空来处理一下这个问题。 当初第一反应就是，该不会是别人盗了我的密码恶意删除吧？ ok hey men, this is my website! Go away!]]> 点击进入我的生活分类！由于实在太忙，都没时间去更新网站了！

前几天打开网站一看，一篇文章都没了，貌似被删了，当时傻眼了，好久没备份了。

打开后台看了一下，文章全没了，评论还在。

还好后来联系了老薛客服，帮忙恢复了数据。

今天才有空来处理一下这个问题。

当初第一反应就是，该不会是别人盗了我的密码恶意删除吧？

ok

hey men, this is my website! Go away!

]]> http://www.coolwinds.cn/article/life/1347.htm/feed 7 外贸网站必备：为ecshop加上IP屏蔽功能，限制ip访问 http://www.coolwinds.cn/article/design/1331.htm http://www.coolwinds.cn/article/design/1331.htm#comments Sun, 25 Sep 2011 15:06:48 +0000 寒风 http://www.coolwinds.cn/?p=1331 点击进入寒风网网站建设分类前几天做外贸站的时候遇到个问题，就是如何限制IP地址段访问，ecshop默认是没有这个功能的，到网上搜了一下，凑了一些代码，自己再加工，添加了一些代码，有了以下成品，先看效果： 后台界面如下： ]]> 点击进入寒风网网站建设分类前几天做外贸站的时候遇到个问题，就是如何限制IP地址段访问，ecshop默认是没有这个功能的，到网上搜了一下，凑了一些代码，自己再加工，添加了一些代码，有了以下成品，先看效果：

20110928修复可耻的IE6兼容问题

后台界面如下：

设定屏蔽IP段后，前台效果如下：

接下来，寒风讲讲具体实现方法(安全起见，仅屏蔽前台，屏蔽IP段地址可在后台设置！)：

前台

1.  includes文件夹下新建ip.php文件，内容为：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49

<?php
/*///////////////////////////////////
//屏蔽IP地址段 V0.1                 
//时间：2011.09.24 15：40           
//代码：http://www.hisune.com      
*/////////////////////////////////////
class IP{                       //获取客户IP地址 
function getIpAdr(&$ip){
$ip = ($_SERVER["HTTP_VIA"]) ? $_SERVER["HTTP_X_FORWARDED_FOR"] : $_SERVER["REMOTE_ADDR"];
$ip = ($ip) ? $ip : $_SERVER["REMOTE_ADDR"];   
}
}
function get_netip($myip){   //只留客户IP地址的前三位 
  $temp=explode(".",$myip);
  $netip.=$temp[0];
  $netip.=".";
  $netip.=$temp[1];
  $netip.=".";
  $netip.=$temp[2];
  return $netip;
}
$filename="includes\ip.txt";     //定义操作文件
$ip_lib=file($filename);  //读取文件数据到数组中
$allow=0;
$IP=new IP;
$thisip="";
$IP->getIpAdr($thisip);
$thenetip=get_netip($thisip);
 
for($i=0;$i<count($ip_lib);$i++){  
  if(ereg($thenetip,$ip_lib[$i])){
    $allow=1;
    break;
  }
}  
 
if ($allow==1) 
{
  echo "<script>location.href='error.php';</script>";
}
//else {
//  echo "";
//} 
/*///////////////////////////////////
//屏蔽IP地址段 V0.1                 
//时间：2011.09.24 15：40           
//代码：http://www.hisune.com      
*/////////////////////////////////////
?>

2.  includes文件夹下新建ip.txt空白文本文档

3.  根目录下新建error.php，内容为：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>错误，您的IP不在本站的服务范围之内。</title>
</head>
 
<body>
 
<div style=" margin:80px 200px; border: solid 1px #C0C0C0;">
  <div style=" border: solid 3px #EAEAEA; padding:30px; text-align:center">
    <img src="themes/bk/images/warning.gif" />&nbsp;抱歉，您的IP地址不在本站的服务范围之内！请联系网站管理员。<br />
    Sorry, your IP address is not within the scope of the services this site! Please contact the webmaster.
  </div>
</div>
</body>
</html>

4 . 在includes文件夹下init.php文件末端插入：

1

require(ROOT_PATH . 'includes/ip.php');

后台

5.  admin文件夹下新建ip.php文件，内容为：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71

<?php
 
/**
 * IP地址段屏蔽后台程序
 * ============================================================================
 * 版权所有 2011-2012 海尚网络，并保留所有权利。
 * 网站地址: http://www.hisune.com；
 * ----------------------------------------------------------------------------
 *文件版本：0.1
 *编写时间：2011-09-22 13:55:12
 *作者：寒风
 *个人网站：http://www.coolwinds.cn
 *专业建站：http://www.hisune.com
 * ============================================================================
**/
//read
$fp = fopen("../includes/ip.txt", 'r');
flock($fp, LOCK_SH);
$content = fread($fp, filesize("../includes/ip.txt"));
flock($fp, LOCK_UN);
fclose($fp);
//display
echo "<div style=\" border:solid 1px #D6D6D6; background:#EAEAEA; margin-left:15px; margin-right:15px;height:35px; line-height:35px; font-weight:bold; font-size:14px; text-align:center;\">IP段屏蔽设置</div>";
 
echo "<div style=\" border-left:solid 1px #D6D6D6;border-right:solid 1px #D6D6D6;border-bottom:solid 1px #D6D6D6; overflow:auto; zoom:1; padding-top:10px;  margin-left:15px; margin-right:15px;\">";
echo "<div style=\"float:left; margin-left:10px; _margin-left:5px; \">";
echo "<form method=\"post\" action=\"ip.php\">";
echo "<textarea name=\"ipkill\" style=\" height:200px; width250px; font-size:12px;\" name=\"ipkill\" id=\"ipkill\">$content</textarea>";
echo "<br />";
echo "<br />";
echo "<input  type=\"submit\" name=\"submit\" value=\"保存\" style=\" cursor:pointer;\">&nbsp;&nbsp;";
echo "<input  type=\"reset\" name=\"reset\" value=\"重置\" style=\" cursor:pointer;\">";
echo "</form>";
echo "</div>";
 
echo "<div style=\"float:right; font-size:12px; margin-right:10px;_margin-right:5px; border:dashed 1px #D6D6D6; padding:5px; \">";
echo "<div style=\"width:98%; padding:3px; background:#EBEBEB;\">1. 在左侧输入要屏蔽的IP地址段</div>";
echo "<br />";
echo "<div style=\"width:98%; padding:3px; background:#EBEBEB;\">2. IP地址段为前三位，每一行一个IP段如：</div>";
echo "192.168.1";
echo "<br />";
echo "192.168.0";
echo "<br />";
echo "<br />";
echo "<div style=\"width:98%; padding:3px; background:#EBEBEB;\">3. 您当前登录的IP地址为：</div>";
echo "<font color=\"#ff0000;\">".$ip=$_SERVER["REMOTE_ADDR"]."</font>";
echo "<br />";
echo "</div>";
 
echo "</div>";
//write
if($_POST['submit']){
$ft = fopen("../includes/ip.txt","w+"); 
fwrite($ft,"$_POST[ipkill]");
fclose($ft);
echo "<script language=\"javascript\">alert('保存成功！');history.go(-1)</script>";
}
/**
 * IP地址段屏蔽后台程序
 * ============================================================================
 * 版权所有 2011-2012 海尚网络，并保留所有权利。
 * 网站地址: http://www.hisune.com；
 * ----------------------------------------------------------------------------
 *文件版本：0.1
 *编写时间：2011-09-22 13:55:12
 *作者：寒风
 *个人网站：http://www.coolwinds.cn
 *专业建站：http://www.hisune.com
 * ============================================================================
**/
?>

6.  admin/templates/top.htm文件：

搜索：

1

<li><a href="{$key}" target="main-frame">{$item}</a></li>

在其后加入：

1

<li><a href="javascript:window.open('ip.php','_blank','width=620,height=350');void(0)">IP段屏蔽</a></li>

这样就可以在ecshop后台导航条处看到链接了

所有代码如上，寒风自己已经测试成功了。

error.php文件用到的图片：

当然，以上方法不仅限于添加到ecshop，添加到任意php站点都是可以的！寒风所写的以上内容只是以ecshop为例！

最后，再次AD一下，我的新站正在准备中，嘿嘿~

]]> http://www.coolwinds.cn/article/design/1331.htm/feed 18 更换服务器，网站终于OK了 http://www.coolwinds.cn/article/life/1324.htm http://www.coolwinds.cn/article/life/1324.htm#comments Thu, 15 Sep 2011 02:52:23 +0000 寒风 http://www.coolwinds.cn/?p=1324 点击进入我的生活分类！之前用的backllc的空间，是在他公司跑路之前买的打折货，40一年，虽然便宜，但问题不断。空间到现在还有半年才到期，现在暂时搁置，看做测试的时候能否用到。 接下来是广告时间：
看到老薛主机又搞团购，特意等到今天来换空间 老薛主机还是不错的，这是我用的第二个老薛收费空间了，如果你还没有参与今天的团购，可以到http://tuan.admin5.com/deal/211去看看，购买优惠券后，所有老薛主机就可以7折优惠了，再加上一次性9折优惠，折上加折，可能是我看到老薛最优惠的一次了。 如果对老薛还不够了解，点击了解老薛
换主机后，立马更新了wp到3.2.1版本，后台居然提示我chrome浏览器版本过低，看了我out了。。。]]> 点击进入我的生活分类！之前用的backllc的空间，是在他公司跑路之前买的打折货，40一年，虽然便宜，但问题不断。空间到现在还有半年才到期，现在暂时搁置，看做测试的时候能否用到。

接下来是广告时间：

看到老薛主机又搞团购，特意等到今天来换空间

老薛主机还是不错的，这是我用的第二个老薛收费空间了，如果你还没有参与今天的团购，可以到http://tuan.admin5.com/deal/211去看看，购买优惠券后，所有老薛主机就可以7折优惠了，再加上一次性9折优惠，折上加折，可能是我看到老薛最优惠的一次了。

如果对老薛还不够了解，点击了解老薛

换主机后，立马更新了wp到3.2.1版本，后台居然提示我chrome浏览器版本过低，看了我out了。。。

发此文以作纪念

]]> http://www.coolwinds.cn/article/life/1324.htm/feed 1