文本域textarea 文本框text图片双击预览功能的实现

js代码如下:
<script type="text/javascript">
function ShowPreview(objid){
	var obj = document.getElementById(objid);
	var r = document.selection.createRange();
	var s = "TMP";
	var rt = r.text;
	var rv = rt+s;
	r.text = rt+s;
	var i = obj.value.indexOf(rv);
	obj.value = obj.value.replace(s,'');
	obj.blur();
	var str;
	if(obj.value.indexOf("\r") == -1){
		str = "\n";
	}else{
		str = "\r\n";
	}
	var p = obj.value.substring(obj.value.lastIndexOf("/", i)+1, i)+obj.value.substring(i, obj.value.indexOf(str, i));
	var l = obj.value.substring(i, obj.value.length);
	if(l.indexOf("\n")==-1) p = obj.value.substring(obj.value.lastIndexOf("|", i)+1, i)+l;
	var u = 'http://127.0.0.1';
	if(p.indexOf("://") != -1) u = '';
	var m = p.match(/^[^\r\n]+\.(jpg|gif|png|bmp)$/);
	if(m != null)
	{
		window.open(u+p);
	}	
}
</script>


html代码如下:
<TEXTAREA id="videoshowpics" ondblclick="ShowPreview('videoshowpics')" name="pics" cols="100">/uploads/201005/127304848493.jpg  /uploads/201005/127304848783.gif  </TEXTAREA>


具体细节自己调试咯.
textarea或者input里为图片路径,双击其中一行图片路径可以打开新窗口查看大图片.

你可能感兴趣的:(JavaScript,html)