文本域(textarea)的高度自适应实现两法0+

26,918 views / 2010.03.11 / 11:11 上午

随着HTML5的即将退出,相信大家对页面更加人性化有了一定的期待,这里我介绍两种方法,让你的textarea能够实现根据内容自动调整高度,让你的页面也炫起来!

方法一,使用JS自动调整

<textarea name="mytextarea" cols="80" style="overflow-y:hidden;height:80px;" onpropertychange="this.style.height=this.scrollHeight+'px';" oninput="this.style.height=this.scrollHeight+'px';"></textarea>

方法二,使用css控制,只需给文本域设置overflow-y:visible样式,比较简单,推荐使用

<textarea style="width:300px;overflow-y:visible"></texarea>
Categories: 感悟 Tags: , , ,

JS数据压缩算法3+

13,891 views / 2009.09.04 / 12:12 下午

研究Google chart API的时候发现它提供的数据压缩算法不错,可以把纯数字的数组压缩成很短的一个字符串,分享如下:

var simpleEncoding = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789';
 
function simpleEncode(values,maxValue) {
 
var chartData = ['s:'];
for (var i = 0; i < values.length; i++) { var currentValue = values[i]; if (!isNaN(currentValue) && currentValue >= 0) {
chartData.push(simpleEncoding.charAt(Math.round((simpleEncoding.length-1) * currentValue / maxValue)));
} else {
chartData.push('_');
}
}
return chartData.join('');
}

测试例子:

var valueArray = new Array(20,100,40,50,60,81,74);
var maxValue = 100;
document.write(simpleEncode(valueArray,maxValue));
Categories: 分享 Tags: , , ,

用js计算时间差,得到比较人性化的结果0+

7,612 views / 2009.09.03 / 5:05 下午

我们经常看到一些文章或者评论的发表时间不是直接显示出死板的Y-m-d格式,而是算了一个时间差,如:发表于2分钟前,这样显得比较人性化,多用于一些非正式网站。下面提供JavaScript的实现方法:

var minute = 1000 * 60;
var hour = minute * 60;
var day = hour * 24;
var halfamonth = day * 15;
var month = day * 30;
 
function getDateDiff(dateTimeStamp){
var now = new Date().getTime();
var diffValue = now - dateTimeStamp;
 
if(diffValue < 0){
 //非法操作
 //alert("结束日期不能小于开始日期!");
 }
 
var monthC =diffValue/month;
var weekC =diffValue/(7*day);
var dayC =diffValue/day;
var hourC =diffValue/hour;
var minC =diffValue/minute;
 
if(monthC>=1){
 result="发表于" + parseInt(monthC) + "个月前";
 }
 else if(weekC>=1){
 result="发表于" + parseInt(weekC) + "个星期前";
 }
 else if(dayC>=1){
 result="发表于"+ parseInt(dayC) +"天前";
 }
 else if(hourC>=1){
 result="发表于"+ parseInt(hourC) +"个小时前";
 }
 else if(minC>=1){
 result="发表于"+ parseInt(minC) +"分钟前";
 }else
 result="刚刚发表";
? return result;
}

如果你得到的原始数据不是时间戳,可以采用下面的函数把字符串转换为标准时间戳, 它相当于JS版的strtotime,只不过精度不同罢了:

function getDateTimeStamp(dateStr){
 return Date.parse(dateStr.replace(/-/gi,"/"));
}
Categories: 感悟 Tags: , ,

使用javascript从url获取参数值0+

4,570 views / 2009.09.01 / 6:06 下午

随着Ajax的泛滥,有时需要我们从url获取变量进行用户交互,本函数提供了获取方法:

function getQuery(name)
{
var reg = new RegExp("(^|&)"+ name +"=([^&]*)(&|$)");
var r = window.location.search.substr(1).match(reg);
if (r!=null) return unescape(r[2]); return null;
}

如需要从下面地址中获取id的值:
http://71j.cn/a.php?a=my&id=7&m=1
只需要在当前页面调用getQuery(“id”)即可。

Categories: 感悟 Tags: , ,

我也收集了一些常用的正则表达式0+

4,091 views / 2009.09.01 / 5:05 下午

兄弟姊妹们,这可是极品文章,强烈建议大家收藏,以后不用每次都费劲脑汁编正则表达式了!
匹配中文字符的正则表达式: [\u4e00-\u9fa5]

匹配双字节字符(包括汉字在内):[^\x00-\xff]

应用:计算字符串的长度(一个双字节字符长度计2,ASCII字符计1)

String.prototype.len=function(){return this.replace([^\x00-\xff]/g,"aa").length;}

匹配空行的正则表达式:\n[\s| ]*\r

匹配HTML标记的正则表达式:/<(.*)>.*<\/\1>|<(.*) \/>/

匹配首尾空格的正则表达式:(^\s*)|(\s*$)

应用:javascript中没有像vbscript那样的trim函数,我们就可以利用这个表达式来实现,如下:

String.prototype.trim = function()
{
return this.replace(/(^\s*)|(\s*$)/g, "");
}

利用正则表达式分解和转换IP地址:

下面是利用正则表达式匹配IP地址,并将IP地址转换成对应数值的javascript程序:

function IP2V(ip)
{
re=/(\d+)\.(\d+)\.(\d+)\.(\d+)/g //匹配IP地址的正则表达式
if(re.test(ip))
{
return RegExp.$1*Math.pow(255,3))+RegExp.$2*Math.pow(255,2))+RegExp.$3*255+RegExp.$4*1
}
else
{
throw new Error("Not a valid IP address!")
}
}

不过上面的程序如果不用正则表达式,而直接用split函数来分解可能更简单,程序如下:

var ip="10.100.20.168"
ip=ip.split(".")
alert("IP值是:"+(ip[0]*255*255*255+ip[1]*255*255+ip[2]*255+ip[3]*1))

匹配Email地址的正则表达式:\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*

匹配网址URL的正则表达式:http://([\w-]+\.)+[\w-]+(/[\w- ./?%&=]*)?

利用正则表达式去除字串中重复的字符的算法程序:[注:此程序不正确,原因见本贴回复]

var s="abacabefgeeii"
var s1=s.replace(/(.).*\1/g,"$1")
var re=new RegExp("["+s1+"]","g")
var s2=s.replace(re,"")
alert(s1+s2) //结果为:abcefgi

我原来在CSDN上发贴寻求一个表达式来实现去除重复字符的方法,最终没有找到,这是我能想到的最简单的实现方法。思路是使用后向引用取出包括重复的字符,再以重复的字符建立第二个表达式,取到不重复的字符,两者串连。这个方法对于字符顺序有要求的字符串可能不适用。

得用正则表达式从URL地址中提取文件名的javascript程序,如下结果为page1

s="http://www.71j.cn/page1.htm"
s=s.replace(/(.*\/){0,}([^\.]+).*/ig,"$2")
alert(s)

利用正则表达式限制网页表单里的文本框输入内容:

用正则表达式限制只能输入中文:

onkeyup="value=value.replace(/[^\u4E00-\u9FA5]/g,'')" onbeforepaste="clipboardData.setData('text',clipboardData.getData('text').replace(/[^\u4E00-\u9FA5]/g,''))"

用正则表达式限制只能输入全角字符:

 onkeyup="value=value.replace(/[^\uFF00-\uFFFF]/g,'')" onbeforepaste="clipboardData.setData('text',clipboardData.getData('text').replace(/[^\uFF00-\uFFFF]/g,''))"

用正则表达式限制只能输入数字:

onkeyup="value=value.replace(/[^\d]/g,'') "onbeforepaste="clipboardData.setData('text',clipboardData.getData('text').replace(/[^\d]/g,''))"

用正则表达式限制只能输入数字和英文:

onkeyup="value=value.replace(/[\W]/g,'') "onbeforepaste="clipboardData.setData('text',clipboardData.getData('text').replace(/[^\d]/g,''))"

判断是否为数字

function isNumber(oNum)
{
if(!oNum) return false;
var strP=/^\d+(\.\d+)?$/;
if(!strP.test(oNum)) return false;
try{
if(parseFloat(oNum)!=oNum) return false;
}
catch(ex)
{
return false;
}
return true;
}
Categories: 分享 Tags: , ,