来自 关于计算机 2019-09-04 19:49 的文章
当前位置: 六合联盟网 > 关于计算机 > 正文

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

为大家分享的JavaScript限制文本框的输入内容代码如下

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

<style type="text/css">
<!--
.STYLE1 {
 color: #0099FF;
 font-weight: bold;
 font-size: x-large;
}
-->
</style>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p align="center" class="STYLE1">亲,试试效果吧!</p>
<p align="center"><strong>请输入数字或字母</strong>:
 <input onkeyup="value=value.replace(/[W]/g,'') "onbeforepaste="clipboardData.setData('text',clipboardData.getData('text').replace(/[^d]/g,''))">
</p>
<p align="center"><strong>请输入数字,只能输入数字哦</strong>:
 <input onkeyup="value=value.replace(/[^d]/g,'') "onbeforepaste="clipboardData.setData('text',clipboardData.getData('text').replace(/[^d]/g,''))">
</p>
<p align="center"><strong>请输入汉字,只能输入汉字哦</strong>:
 <input onkeyup="value=value.replace(/[^u4E00-u9FA5]/g,'')" onbeforepaste="clipboardData.setData('text',clipboardData.getData('text').replace(/[^u4E00-u9FA5]/g,''))">
</p>

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

运行效果图:

运行效果截图如下:

图片 1

图片 2

下面再给大家补充一些:

在线演示地址如下:

小数点后只能有最多两位(数字,中文都可输入),不能输入字母和运算符号:

<input onKeyPress="if((event.keyCode<48 || event.keyCode>57) && event.keyCode!=46 || //./d/d$/.test(value))event.returnValue=false">

具体代码如下:

文本框只能输入数字代码(小数点也不能输入)

<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>
<input onkeyup="this.value=this.value.replace(//D/g,'')" onafterpaste="this.value=this.value.replace(//D/g,'')">

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

其实还可以限制其他内容,比如只能是字母,大家可以尝试一些其他的。

您可能感兴趣的文章:

  • 改变文本框字体颜色的js脚本
  • 捕获input文本框内容改变事件的js代码
  • 文本框中,回车键触发事件的js代码[多浏览器兼容]
  • js实时计算字数提醒的文本框
  • js各种验证文本框输入格式(正则表达式)
  • js中判断文本框是否为空的两种方法
  • 简单JS自动提示文本框代码
  • 在js(jquery)中获得文本框焦点和失去焦点的方法
  • js限制文本框输入长度两种限制方式(长度、字节数)
  • JS文本框不能输入空格验证方法
  • 鼠标焦点离开文本框时验证的js代码
  • 利用js实现前台动态添加文本框,后台获取文本框内容(示例代码)
  • js获取光标位置和设置文本框光标位置示例代码
  • JS判断文本框内容改变事件的简单实例
  • js限制文本框只能输入数字方法小结
  • js实现文本框只允许输入数字并限制数字大小的方法
  • JS给Textarea文本框添加行号的方法
  • js限制文本框的输入内容代码分享(3类)
  • JS简单限制textarea内输入字符数量的方法
  • js计算文本框输入的字符数

以上就是为大家分享的JavaScript限制文本框的输入内容代码

您可能感兴趣的文章:

  • 改变文本框字体颜色的js脚本
  • 捕获input文本框内容改变事件的js代码
  • 文本框中,回车键触发事件的js代码[多浏览器兼容]
  • js实时计算字数提醒的文本框
  • js各种验证文本框输入格式(正则表达式)
  • js中判断文本框是否为空的两种方法
  • 简单JS自动提示文本框代码
  • 在js(jquery)中获得文本框焦点和失去焦点的方法
  • js限制文本框输入长度两种限制方式(长度、字节数)
  • JS文本框不能输入空格验证方法
  • 鼠标焦点离开文本框时验证的js代码
  • 利用js实现前台动态添加文本框,后台获取文本框内容(示例代码)
  • js获取光标位置和设置文本框光标位置示例代码
  • JS判断文本框内容改变事件的简单实例
  • js限制文本框只能输入数字方法小结
  • JS模仿编辑器实时改变文本框宽度和高度大小的方法
  • js实现文本框只允许输入数字并限制数字大小的方法
  • JS给Textarea文本框添加行号的方法
  • JS简单限制textarea内输入字符数量的方法
  • js计算文本框输入的字符数

本文由六合联盟网发布于关于计算机,转载请注明出处:JS模仿编辑器实时改变文本框宽度和高度大小的方

关键词: