编程 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 相关文章推荐

Jquery作者John Resig自己封装的javascript 常用函数

Nov 09 Javascript

document.forms用法示例介绍

Jun 26 Javascript

jquery实现删除一个元素后面的所有元素功能

Dec 21 Javascript

学习Javascript面向对象编程之封装

Feb 23 Javascript

常用Javascript函数与原型功能收藏(必看篇)

Oct 09 Javascript

理解javascript中的闭包

Jan 11 Javascript

H5手机端多文件上传预览插件

Apr 21 Javascript

vue-baidu-map 进入页面自动定位的解决方案(推荐)

Apr 28 Javascript

解决vuejs 使用value in list 循环遍历数组出现警告的问题

Sep 26 Javascript

vue cli3.0 引入eslint 结合vscode使用

May 27 Javascript

微信小程序点击切换样式scroll-view实现代码实例

Oct 11 Javascript

浅谈vue在html中出现{{}}的原因及解决方式

Nov 16 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定时自动生成静态HTML的实现代码

2010/06/20 PHP

php分页代码学习示例分享

2014/02/20 PHP

php中opendir函数用法实例

2014/11/15 PHP

PHP+jQuery翻板抽奖功能实现

2015/10/19 PHP

Ctrl+Enter提交内容信息

2006/06/26 Javascript

用JavaScript页面不刷新时全选择，全删除（GridView）

2009/04/14 Javascript

JQuery 无废话系列教程(一) jquery入门 [推荐]

2009/06/23 Javascript

js实现页面打印功能实例代码(附去页眉页脚功能代码)

2009/12/15 Javascript

js下利用控制器载入对应脚本

2010/07/17 Javascript

JavaScript call apply使用 JavaScript对象的方法绑定到DOM事件后this指向问题

2011/09/28 Javascript

jquery跨域请求示例分享(jquery发送ajax请求)

2014/03/25 Javascript

详谈jQuery操纵DOM元素属性 attr()和removeAtrr()方法

2015/01/22 Javascript

在Mac OS上安装使用Node.js的项目自动化构建工具Gulp

2016/06/18 Javascript

对Js OOP编程创建对象的一些全面理解

2016/07/26 Javascript

Vue Router去掉url中默认的锚点#

2018/08/01 Javascript

[50:45]2018DOTA2亚洲邀请赛 4.6 淘汰赛 VP vs TNC 第一场

2018/04/10 DOTA

[47:52]完美世界DOTA2联赛PWL S2 PXG vs InkIce 第二场 11.26

2020/11/30 DOTA

Python中将dataframe转换为字典的实例

2018/04/13 Python

Python3 导入上级目录中的模块实例

2019/02/16 Python

Python 解决OPEN读文件报错 ,路径以及r的问题

2019/12/19 Python

python GUI库图形界面开发之PyQt5开发环境配置与基础使用

2020/02/25 Python

jupyter notebook 参数传递给shell命令行实例

2020/04/10 Python

keras 多gpu并行运行案例

2020/06/10 Python

CSS3中的Media Queries学习笔记

2016/05/23 HTML / CSS

汽修专业学生自我鉴定

2013/11/16 职场文书

个人党性剖析材料

2014/02/03 职场文书

小学优秀辅导员事迹材料

2014/05/11 职场文书

洗手间标语

2014/06/23 职场文书

干部年终考核评语

2015/01/04 职场文书

简历自我评价优缺点

2015/03/11 职场文书

公务员廉洁从政心得体会

2016/01/19 职场文书

初中历史教学反思

2016/02/19 职场文书

高考升学宴主持词

2019/06/21 职场文书

高中班主任寄语

2019/06/21 职场文书

JavaScript数组几个常用方法总结

2021/11/11 Javascript

德劲DE1102数字调谐收音机机评

2022/04/07 无线电