JS模仿编辑器实时改变文本框宽度和高度大小的方法


Posted in Javascript onAugust 17, 2015

本文实例讲述了JS模仿编辑器实时改变文本框宽度和高度大小的方法。分享给大家供大家参考。具体如下:

这里演示JS模仿编辑器中实时改变文本框大小,包括宽度和高度的方法,在一些在线编辑器,比如eWebEditor中,就有一个功能,让文本框不断的增大或减小,以适应页面的大小,这个功能是如何实现的呢?请您参考一下这个程序,相信你会从中获益。

运行效果截图如下:

JS模仿编辑器实时改变文本框宽度和高度大小的方法

在线演示地址如下:

具体代码如下:

<html>
<head>
<title>改变文字区域的高宽</title>
<script language="javascript">
<!--
 function addrows(){
  rows = form1.txt.rows;
  rows++;
  form1.txt.rows = rows;
 }
 function addcols(){
  cols = form1.txt.cols;
  cols++;
  form1.txt.cols = cols;
 }
//-->
</script>
</head>
<body>
<form name="form1">
 <textarea name="txt"></textarea>
 <input type="button" value="增加高" onClick="addrows()">
 <input type="button" value="增加宽" onClick="addcols()">
</form>
</body>
</html>

希望本文所述对大家的javascript程序设计有所帮助。

Javascript 相关文章推荐
千分位数字格式化(用逗号隔开 代码已做了修改 支持0-9位逗号隔开)的JS代码
Dec 05 Javascript
jquery实现LED广告牌旋转系统图片切换效果代码分享
Aug 26 Javascript
JavaScript中iframe实现局部刷新的几种方法汇总
Jan 06 Javascript
jquery插件jquery.dragscale.js实现拖拽改变元素大小的方法(附demo源码下载)
Feb 25 Javascript
Bootstrap学习笔记之css样式设计(1)
Jun 07 Javascript
神级程序员JavaScript300行代码搞定汉字转拼音
May 20 Javascript
深入剖析Express cookie-parser中间件实现示例
Feb 01 Javascript
用vue快速开发app的脚手架工具
Jun 11 Javascript
详解Vue中使用Echarts的两种方式
Jul 03 Javascript
在vue中使用SockJS实现webSocket通信的过程
Aug 29 Javascript
vue自定义指令的创建和使用方法实例分析
Dec 04 Javascript
Vue3 中的数据侦测的实现
Oct 09 Javascript
js实现匹配时换色的输入提示特效代码
Aug 17 #Javascript
js实现表单Radio切换效果的方法
Aug 17 #Javascript
js下拉选择框与输入框联动实现添加选中值到输入框的方法
Aug 17 #Javascript
jquery动感漂浮导航菜单代码分享
Apr 15 #Javascript
JavaScript判断表单中多选框checkbox选中个数的方法
Aug 17 #Javascript
jquery实现动静态条形统计图
Aug 17 #Javascript
JS实现的5级联动Select下拉选择框实例
Aug 17 #Javascript
You might like
2020显卡排行榜天梯图 显卡天梯图2020年3月最新版
2020/04/02 数码科技
下载文件的点击数回填
2006/10/09 PHP
上传文件先创建目录 再上传到目录里面去
2010/12/29 PHP
php异常:Parse error: syntax error, unexpected T_ENCAPSED_AND_WHITESPACE  eval()'d code error
2011/05/19 PHP
提升PHP性能的21种方法介绍
2013/06/25 PHP
php实现计算百度地图坐标之间距离的方法
2016/05/05 PHP
PHP中创建和编辑Excel表格的方法
2018/09/13 PHP
JavaScript地图拖动功能SpryMap的简单实现
2013/07/17 Javascript
JS传递对象数组为参数给后端,后端获取的实例代码
2016/06/28 Javascript
深入分析javascript中console命令
2016/08/14 Javascript
AngularJS实现使用路由切换视图的方法
2017/01/24 Javascript
fullCalendar中文API官方文档
2017/02/07 Javascript
快速处理vue渲染前的显示问题
2018/03/05 Javascript
JavaScript实现构造json数组的方法分析
2018/08/17 Javascript
通过实例了解js函数中参数的传递
2019/06/15 Javascript
H5实现手机拍照和选择上传功能
2019/12/18 Javascript
vuex管理状态仓库使用详解
2020/07/29 Javascript
vue添加自定义右键菜单的完整实例
2020/12/08 Vue.js
python使用pyhook监控键盘并实现切换歌曲的功能
2014/07/18 Python
Python正则抓取网易新闻的方法示例
2017/04/21 Python
python机器学习之决策树分类详解
2017/12/20 Python
Python整数对象实现原理详解
2019/07/01 Python
Python使用ElementTree美化XML格式的操作
2020/03/06 Python
记一次django内存异常排查及解决方法
2020/08/07 Python
django前端页面下拉选择框默认值设置方式
2020/08/09 Python
CSS3点击按钮实现背景渐变动画效果
2016/10/19 HTML / CSS
iframe在移动端的缩放的示例代码
2018/10/12 HTML / CSS
印度尼西亚最大的电商平台:Tokopedia(印尼版淘宝)
2017/12/02 全球购物
Eyeko美国:屡获殊荣的睫毛膏、眼线笔和眉妆
2018/07/05 全球购物
加拿大在线隐形眼镜和眼镜店:VisionPros
2019/10/06 全球购物
亚马逊新加坡官方网站:Amazon.sg
2020/03/25 全球购物
长曲棍球装备:Lacrosse Monkey
2020/12/02 全球购物
西式婚礼主持词
2014/03/13 职场文书
大学团日活动新闻稿
2014/09/10 职场文书
MYSQL数据库使用UTF-8中文编码乱码的解决办法
2021/05/26 MySQL
mybatis 获取更新记录的id
2022/05/20 Java/Android