苗景云的博客

PHPCMS自带组图功能无排序功能，特别是需要对图片和说明排序时很不方便，通过此方法可实现组图排序。

工具/原料

PHPCMS V9   dreamweaver

方法/步骤

1 新增上下移动的按钮

用dreamweaver打开文件form.inc.php，文件位置：phpcms/modules/content/fields/images/form.inc.php

在第八行的".L('remove_out', '', 'content')."后插入以下代码：

| <a href=\"javascript:;\" onClick=\"moveUp(this)\">".L('remove_up', '', 'content')."</a> | <a href=\"javascript:;\" onClick=\"moveDown(this)\">".L('remove_down', '', 'content')."</a>

2 新增语言项

打开文件content.lang.php，文件位置：phpcms/languages/zh-cn/content.lang.php

在41行后面插入以下代码：

$LANG['remove_up'] = '↑上移';

$LANG['remove_down'] = '↓下移';

3 新增移动函数

打开文件content_addtop.js，文件位置：statics/js/content_addtop.js

修改function change_images

function change_images(uploadid,returnid){
	var d = window.top.art.dialog({id:uploadid}).data.iframe;
	var in_content = d.$("#att-status").html().substring(1);
	var in_filename = d.$("#att-name").html().substring(1);
	var str = $('#'+returnid).html();
	var contents = in_content.split('|');
	var filenames = in_filename.split('|');
	$('#'+returnid+'_tips').css('display','none');
	if(contents=='') return true;
	$.each( contents, function(i, n) {
		var ids = parseInt(Math.random() * 10000 + 10*i); 
		var filename = filenames[i].substr(0,filenames[i].indexOf('.'));
		str += "<li id='image"+ids+"'><input type='text' name='"+returnid+"_url[]' value='"+n+"' style='width:310px;' ondblclick='image_priview(this.value);' class='input-text'> <input type='text' name='"+returnid+"_alt[]' value='"+filename+"' style='width:160px;' class='input-text' onfocus=\"if(this.value == this.defaultValue) this.value = ''\" onblur=\"if(this.value.replace(' ','') == '') this.value = this.defaultValue;\"> <a href=\"javascript:remove_div('image"+ids+"')\">移除</a> | <a href=\"javascript:;\" onClick=\"moveUp(this)\">上移</a> | <a href=\"javascript:;\" onClick=\"moveDown(this)\">下移</a></li>";
		});
	
	$('#'+returnid).html(str);
}

在末尾加入以下代码：

function moveUp(obj){  
var current=$(obj).parent();  
var prev=current.prev();  
if(prev){  
    current.insertBefore(prev);  
    }  
}  
function moveDown(obj){
var current=$(obj).parent();
var next=current.next();  
if(next){  
    current.insertAfter(next);  
    }  
}

4 更新系统缓存

接下来需要更新一下系统缓存，点击后台的“更新缓存”后，添加一条带组图字段的文章，选中图片后就会看到效果。此时可以点击“上移”和“下移”来控制图片的顺序

END