js实现文本框中输入文字页面中div层同步获取文本框内容的方法


Posted in Javascript onMarch 03, 2015

本文实例讲述了js实现文本框中输入文字页面中div层同步获取文本框内容的方法。分享给大家供大家参考。具体实现方法如下:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />

<title>文本框中输入文字,页面中div层同步获取文本框内容</title>

<style>

textarea{width:300px;height:150px; border:1px solid #CCC; font-size:12px; color:#000;}

p{ padding-left:30px; text-indent:-30px;width:270px;height:250px; border:1px solid #900; margin-top:50px; font-size:12px; color:#F00; line-height:21px; overflow:hidden}

</style>

<script type="text/javascript">

 function SwapTxt()

  {

      var txt = document.getElementById("eml").value;

      document.getElementById("lyny").innerHTML=txt;

  }

</script>

</head>

<body>

  <textarea name="" cols="" rows="" class="loe_hk10" id="eml" onkeyup="SwapTxt()"></textarea>

  <p id="lyny">代码家园提示:请在上面的文本框中输入文字,如3water.com</p>

</body>

</html>

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

Javascript 相关文章推荐
Javascript的getYear、getFullYear、getUTCFullYear异同分享
Nov 30 Javascript
顶部缓冲下拉菜单导航特效的JS代码
Aug 27 Javascript
javascript的日期对象、数组对象、二维数组使用说明
Dec 22 Javascript
jQuery中DOM操作实例分析
Jan 23 Javascript
javascript中对Date类型的常用操作小结
May 19 Javascript
BootStrap智能表单实战系列(八)表单配置json详解
Jun 13 Javascript
jQuery EasyUI Draggable拖动组件
Mar 01 Javascript
javascript图片预览和上传(兼容IE)
Mar 15 Javascript
JavaScript实用代码小技巧
Aug 23 Javascript
js获取 gif 的帧数的代码实例
Sep 10 Javascript
javascript的delete运算符知识点总结
Nov 19 Javascript
Vuex中的Mutations的具体使用方法
Jun 01 Javascript
JS实现文字放大效果的方法
Mar 03 #Javascript
jQuery实现的感应鼠标悬停图片色彩渐显效果
Mar 03 #Javascript
js给网页加上背景音乐及选择音效的方法
Mar 03 #Javascript
分享一则JavaScript滚动条插件源码
Mar 03 #Javascript
深入理解JavaScript系列(35):设计模式之迭代器模式详解
Mar 03 #Javascript
jQuery选择器之基本选择器与层次选择器
Mar 03 #Javascript
JS实现在网页中弹出一个输入框的方法
Mar 03 #Javascript
You might like
php-fpm添加service服务的例子
2018/04/27 PHP
php从数据库中获取数据用ajax传送到前台的方法
2018/08/20 PHP
PHP随机数函数rand()与mt_rand()的讲解
2019/03/25 PHP
Yii框架自定义数据库操作组件示例
2019/11/11 PHP
js左侧多级菜单动态的解决方案
2010/02/01 Javascript
Ext 今日学习总结
2010/09/19 Javascript
jQuery-onload让第一次页面加载时图片是淡入方式显示
2012/05/23 Javascript
jQuery获取剪贴板内容的方法
2016/06/16 Javascript
使用JS和canvas实现gif动图的停止和播放代码
2017/09/01 Javascript
微信小程序通过保存图片分享到朋友圈功能
2018/05/24 Javascript
微信用户访问小程序的登录过程详解
2019/09/20 Javascript
JS实现打字游戏
2019/12/17 Javascript
jQuery实现视频展示效果
2020/05/30 jQuery
vue 计算属性和侦听器的使用小结
2021/01/25 Vue.js
Vue2.x-使用防抖以及节流的示例
2021/03/02 Vue.js
python中文乱码的解决方法
2013/11/04 Python
Python实现修改IE注册表功能示例
2018/05/10 Python
Python subprocess模块常见用法分析
2018/06/12 Python
Python基于多线程实现抓取数据存入数据库的方法
2018/06/22 Python
Python Pandas批量读取csv文件到dataframe的方法
2018/10/08 Python
Python GUI布局尺寸适配方法
2018/10/11 Python
两个元祖T1=('a', 'b'),T2=('c', 'd')使用匿名函数将其转变成[{'a': 'c'},{'b': 'd'}]的几种方法
2019/03/05 Python
OpenCV 边缘检测
2019/07/10 Python
Python加速程序运行的方法
2020/07/29 Python
Python如何使用ElementTree解析xml
2020/10/12 Python
WatchShop法国:英国排名第一的独立手表零售商
2020/02/17 全球购物
美国在线艺术商店:HandmadePiece
2020/11/06 全球购物
英国领先的男装设计师服装独立零售商:Repertoire Fashion
2020/10/19 全球购物
《小鹰学飞》教学反思
2014/04/23 职场文书
银行青年文明号事迹材料
2014/05/31 职场文书
欢迎领导检查标语
2014/06/27 职场文书
平安工地汇报材料
2014/08/19 职场文书
交通事故赔偿协议书
2014/10/16 职场文书
文化苦旅读书笔记
2015/06/29 职场文书
对讲机知识
2022/04/07 无线电
oracle设置密码复杂度及设置超时退出的功能
2022/06/28 Oracle