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 相关文章推荐
jquery获取input表单值的代码
Apr 19 Javascript
文本域光标操作的jQuery扩展分享
Mar 10 Javascript
基于豆瓣API+Angular开发的web App
Jan 02 Javascript
jQuery Ajax中的事件详细介绍
Apr 16 Javascript
微信小程序 页面跳转传递值几种方法详解
Jan 12 Javascript
jQuery插件FusionCharts绘制的2D条状图效果【附demo源码】
May 13 jQuery
浅谈vue,angular,react数据双向绑定原理分析
Nov 28 Javascript
JS异步函数队列功能实例分析
Nov 28 Javascript
React Native之prop-types进行属性确认详解
Dec 19 Javascript
JS实现的JSON数组去重算法示例
Apr 11 Javascript
详解vue中的computed的this指向问题
Dec 05 Javascript
webpack4.0+vue2.0利用批处理生成前端单页或多页应用的方法
Jun 28 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
php读取本地文件常用函数(fopen与file_get_contents)
2013/09/09 PHP
php 判断字符串中是否包含html标签
2014/02/17 PHP
php数组删除元素示例
2014/03/21 PHP
php阳历转农历优化版
2016/08/08 PHP
js 解决“options为空或不是对象”
2008/12/22 Javascript
类似GMAIL的Ajax信息反馈显示
2010/02/16 Javascript
JavaScript 模式之工厂模式(Factory)应用介绍
2012/11/15 Javascript
解析js中获得父窗口链接getParent方法以及各种打开窗口的方法
2013/06/19 Javascript
javascript鼠标滑动评分控件完整实例
2015/05/13 Javascript
深入分析Javascript事件代理
2016/01/30 Javascript
深入理解js中this的用法
2016/05/28 Javascript
详解vuelidate 对于vueJs2.0的验证解决方案
2017/03/09 Javascript
js自定义瀑布流布局插件
2017/05/16 Javascript
Node.js pipe实现源码解析
2017/08/12 Javascript
Angular学习笔记之集成三方UI框架、控件的示例
2018/03/23 Javascript
js/jQuery实现全选效果
2019/06/17 jQuery
vue 组件销毁并重置的实现
2020/01/13 Javascript
[00:12]DAC2018 no[o]ne亮相SOLO赛 他是否如他的id一样无人可挡?
2018/04/06 DOTA
Python使用sftp实现上传和下载功能(实例代码)
2017/03/14 Python
Django使用paginator插件实现翻页功能的实例
2018/10/24 Python
pygame游戏之旅 添加游戏介绍
2018/11/20 Python
Pytorch使用MNIST数据集实现CGAN和生成指定的数字方式
2020/01/10 Python
git查看、创建、删除、本地、远程分支方法详解
2020/02/18 Python
tensorflow图像裁剪进行数据增强操作
2020/06/30 Python
多个版本的python共存时使用pip的正确做法
2020/10/26 Python
HTML5 新标签全部总汇(推荐)
2016/06/13 HTML / CSS
世界上最大的罕见唱片、CD和音乐纪念品网上商店:991.com
2018/05/03 全球购物
什么是典型的软件三层结构?软件设计为什么要分层?软件分层有什么好处?
2012/03/14 面试题
通信研究生自荐信
2014/02/01 职场文书
社区母亲节活动方案
2014/03/05 职场文书
学校安全工作汇报材料
2014/08/16 职场文书
奖学金申请个人主要事迹材料
2015/11/04 职场文书
2016开学第一课心得体会
2016/01/23 职场文书
php中pcntl_fork详解
2021/04/01 PHP
Python基于Opencv识别两张相似图片
2021/04/25 Python
python如何做代码性能分析
2021/04/26 Python