编程 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基本对象

Jan 11 Javascript

jQuery使用手册之二 DOM操作

Mar 24 Javascript

jQuery $.each的用法说明

Mar 22 Javascript

JavaScript对内存分配及管理机制详细解析

Nov 11 Javascript

jQuery常用操作方法及常用函数总结

Jun 19 Javascript

javascript实现跨域的方法汇总

Jun 25 Javascript

Jquery全屏相册插件zoomvisualizer具有调节放大与缩小功能

Nov 02 Javascript

js 递归和定时器的实例解析

Feb 03 Javascript

angularJs中跳转到指定的锚点实例($anchorScroll)

Aug 31 Javascript

在vue中使用v-bind:class的选项卡方法

Sep 27 Javascript

小程序使用watch监听数据变化的方法详解

Sep 20 Javascript

js中位数不足自动补位扩展padLeft、padRight实现代码

Apr 06 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

set_exception_handler函数在ThinkPHP中的用法

2014/10/31 PHP

Yii开启片段缓存的方法

2016/03/28 PHP

php阳历转农历优化版

2016/08/08 PHP

xml分页+ajax请求数据源+dom取结果实例代码

2008/10/31 Javascript

更换select下拉菜单背景样式的实现代码

2011/12/20 Javascript

把jQuery的类、插件封装成seajs的模块的方法

2014/03/12 Javascript

在jquery中的ajax方法怎样通过JSONP进行远程调用

2014/04/04 Javascript

jquery判断输入密码两次是否相等

2020/04/22 Javascript

JS实现中国公民身份证号码有效性验证

2017/02/20 Javascript

AngularJS中控制器函数的定义与使用方法示例

2017/10/10 Javascript

关于js对textarea换行符的处理方法浅析

2018/08/03 Javascript

详解Vue开发微信H5微信分享签名失败问题解决方案

2018/08/09 Javascript

Vue 指令实现按钮级别权限管理功能

2019/04/23 Javascript

Vue CLI3中使用compass normalize的方法

2019/05/30 Javascript

微信小程序实现语音识别转文字功能及遇到的坑

2019/08/02 Javascript

手把手教你如何编译打包video.js

2020/12/09 Javascript

[02:15]2015国际邀请赛选手档案IG.Ferrari 430

2015/07/30 DOTA

[01:09]模型精美，特效酷炫！TI9不朽宝藏Ⅰ鉴赏

2019/05/10 DOTA

Python使用scrapy抓取网站sitemap信息的方法

2015/04/08 Python

python脚本替换指定行实现步骤

2017/07/11 Python

深入理解Django的中间件middleware

2018/03/14 Python

python中实现字符串翻转的方法

2018/07/11 Python

Python Selenium 之关闭窗口close与quit的方法

2019/02/13 Python

python模拟菜刀反弹shell绕过限制【推荐】

2019/06/25 Python

详解python中自定义超时异常的几种方法

2019/07/29 Python

Python序列类型的打包和解包实例

2019/12/21 Python

django使用JWT保存用户登录信息

2020/04/22 Python

Python collections模块的使用方法

2020/10/09 Python

python 基于opencv去除图片阴影

2021/01/26 Python

物业电工岗位职责

2013/11/20 职场文书

yy生日主持词

2014/03/20 职场文书

副总经理党的群众路线教育实践活动个人对照检查材料思想汇报

2014/10/06 职场文书

房屋分割离婚协议书范本

2014/12/01 职场文书

研究生给导师的自荐信

2015/03/06 职场文书

2015年“我们的节日·重阳节”活动总结

2015/07/29 职场文书

Python使用Kubernetes API访问集群

2021/05/30 Python