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代码优化 遍历篇
Nov 01 Javascript
Js使用WScript.Shell对象执行.bat文件和cmd命令
Dec 18 Javascript
jQuery前端分页示例分享
Feb 10 Javascript
JavaScript判断字符长度、数字、Email、电话等常用判断函数分享
Apr 01 Javascript
JavaScript中this的四个绑定规则总结
Sep 26 Javascript
JavaScript基础——使用Canvas绘图
Nov 02 Javascript
php register_shutdown_function函数详解
Jul 23 Javascript
JavaScript自执行函数和jQuery扩展方法详解
Oct 27 jQuery
JS实现分页浏览横向图片(类轮播)实例代码
Nov 06 Javascript
微信小程序实现全国机场索引列表
Jan 31 Javascript
jQuery动态操作表单示例【基于table表格】
Dec 06 jQuery
vue-cli2.0转3.0之项目搭建的详细步骤
Dec 11 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
跟我学Laravel之配置Laravel
2014/10/15 PHP
PHP流Streams、包装器wrapper概念与用法实例详解
2017/11/17 PHP
PHP+redis实现的购物车单例类示例
2019/02/02 PHP
jquery $.ajax入门应用一
2008/11/19 Javascript
基于JavaScript 声明全局变量的三种方式详解
2013/05/07 Javascript
JS 加入收藏夹的代码(主流浏览器通用)
2013/05/13 Javascript
javascript中的undefined和not defined区别示例介绍
2014/02/26 Javascript
node.js实现BigPipe详解
2014/12/05 Javascript
微信中一些常用的js方法汇总
2015/03/12 Javascript
ECMAScript6块级作用域及新变量声明(let)
2015/06/12 Javascript
jquery按回车键实现表单提交的简单实例
2016/05/25 Javascript
基于jQuery制作小图标上下滑动特效
2017/01/18 Javascript
Vue实现路由跳转和嵌套
2017/06/20 Javascript
vuejs实现标签选项卡动态更改css样式的方法
2018/05/31 Javascript
vue2.0 如何在hash模式下实现微信分享
2019/01/22 Javascript
JavaScript 浏览器对象模型BOM原理与常见用法实例分析
2019/12/16 Javascript
node.js使用 http-proxy 创建代理服务器操作示例
2020/02/10 Javascript
关于vue-cli3打包代码后白屏的解决方案
2020/09/02 Javascript
[02:40]2018年度DOTA2最佳新人-完美盛典
2018/12/16 DOTA
在Heroku云平台上部署Python的Django框架的教程
2015/04/20 Python
Python中sort和sorted函数代码解析
2018/01/25 Python
python判断设备是否联网的方法
2018/06/29 Python
对python中Json与object转化的方法详解
2018/12/31 Python
Django框架验证码用法实例分析
2019/05/10 Python
使用Tkinter制作信息提示框
2020/02/18 Python
详解python模块pychartdir安装及导入问题
2020/10/22 Python
html5记忆翻牌游戏实现思路及代码
2013/07/25 HTML / CSS
HTML5新增加的功能详解
2016/09/05 HTML / CSS
马来西亚最大的电器网站:Senheng
2017/10/13 全球购物
销售经理工作职责范文
2013/12/03 职场文书
便利店促销方案
2014/02/20 职场文书
小学生中国梦演讲稿
2014/04/23 职场文书
3.15消费者权益日活动总结
2015/02/09 职场文书
写给老师的保证书
2015/05/09 职场文书
python内置进制转换函数的操作
2021/06/02 Python
解决Pytorch修改预训练模型时遇到key不匹配的情况
2021/06/05 Python