编程 Javascript

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程序设计有所帮助。

- Author -

代码家园

声明：登载此文出于传递更多信息之目的，并不意味着赞同其观点或证实其描述。

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