jQuery实现鼠标单击网页文字后在文本框显示的方法


Posted in Javascript onMay 06, 2015

本文实例讲述了jQuery实现鼠标单击网页文字后在文本框显示的方法。分享给大家供大家参考。具体实现方法如下:

<!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=utf-8" />
<title>无标题文档</title>
<script src="js/jquery.min.js" type="text/javascript"></script>
</head>
<body>
<ul>
<li>张三</li>
<li>李四</li>
<li>王五</li>
<li>赵六</li>
</ul>
<table width="200" border="1" cellspacing="0" cellpadding="0">
 <tr>
  <td>选择</td>
  <td>姓名</td>
 </tr>
 <tr>
  <td><input type="checkbox" name="checkbox" value="1" /></td>
  <td><input type="text" name="username" value="" /></td>
 </tr>
 <tr>
  <td><input type="checkbox" name="checkbox" value="1" /></td>
  <td><input type="text" name="username" value="" /></td>
 </tr>
 <tr>
  <td><input type="checkbox" name="checkbox" value="1" /></td>
  <td><input type="text" name="username" value="" /></td>
 </tr>
</table>
<script>
$("ul li").click(function(){
var text = $(this).text();
$("input").val("");
$("input:checked").parents("td").siblings("td").children("input").val(text);
})
</script>
</body>
</html>

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

Javascript 相关文章推荐
用javascript编写的第一人称射击游戏
Feb 25 Javascript
Jquery从头学起第四讲 jquery入门教程
Aug 01 Javascript
javascript之querySelector和querySelectorAll使用说明
Oct 09 Javascript
JQuery select(下拉框)操作方法汇总
Apr 15 Javascript
jQuery实现仿腾讯视频列表分页效果的方法
Aug 07 Javascript
jquery实现经典的淡入淡出选项卡效果代码
Sep 22 Javascript
JS解决iframe之间通信和自适应高度的问题
Aug 24 Javascript
JavaScript数据类型和变量_动力节点Java学院整理
Jun 26 Javascript
js数据类型检测总结
Aug 05 Javascript
小程序登录/注册页面设计的实现代码
May 24 Javascript
微信小程序顶部导航栏可滑动并选中放大
Dec 05 Javascript
创建与框架无关的JavaScript插件
Dec 01 Javascript
js实现点击按钮后给Div图层设置随机背景颜色的方法
May 06 #Javascript
JS实现CheckBox复选框全选全不选功能
May 06 #Javascript
javascript使用avalon绑定实现checkbox全选
May 06 #Javascript
js实现滑动触屏事件监听的方法
May 05 #Javascript
JS根据生日算年龄的方法
May 05 #Javascript
js改变Iframe中Src的方法
May 05 #Javascript
js网页滚动条滚动事件实例分析
May 05 #Javascript
You might like
PHP使用stream_context_create()模拟POST/GET请求的方法
2016/04/02 PHP
利用PHP生成CSV文件简单示例
2016/12/21 PHP
Eclipse PHPEclipse 配置的具体步骤
2017/08/08 PHP
PHP Post获取不到非表单数据的问题解决办法
2018/02/27 PHP
javascript Xml增删改查(IE下)操作实现代码
2009/01/30 Javascript
Ajax搜索结果页面下方的分页按钮的生成
2012/04/05 Javascript
在子窗口中关闭父窗口的一句代码
2013/10/21 Javascript
jQuery(js)获取文字宽度(显示长度)示例代码
2013/12/31 Javascript
javascript的函数作用域
2014/11/12 Javascript
node.js中的fs.fstat方法使用说明
2014/12/15 Javascript
Javascript中arguments和arguments.callee的区别浅析
2015/04/24 Javascript
JS面向对象编程详解
2016/03/06 Javascript
jQuery实现选项联动轮播效果【附实例】
2016/04/19 Javascript
无需 Flash 使用 jQuery 复制文字到剪贴板
2016/04/26 Javascript
JavaScript中的继承之类继承
2016/05/01 Javascript
Angularjs CURD 详解及实例代码
2016/09/14 Javascript
jQuery下拉菜单的实现代码
2016/11/03 Javascript
给easyui datebox扩展一个清空的实例
2016/11/09 Javascript
js转换对象为xml
2017/02/17 Javascript
nodejs中向HTTP响应传送进程的输出
2017/03/19 NodeJs
AngularJs点击状态值改变背景色的实例
2017/12/18 Javascript
JS实现点击下拉菜单把选择的内容同步到input输入框内的实例
2018/01/23 Javascript
Vue.js实现可配置的登录表单代码详解
2018/03/29 Javascript
Vue实现日历小插件
2019/06/26 Javascript
node.js 如何监视文件变化
2020/09/01 Javascript
[01:38:19]夜魇凡尔赛茶话会 第五期
2021/03/11 DOTA
Python 获取中文字拼音首个字母的方法
2018/11/28 Python
对Python3中dict.keys()转换成list类型的方法详解
2019/02/03 Python
Python程序暂停的正常处理方法
2019/11/07 Python
HTML5实现文件断点续传的方法
2017/01/04 HTML / CSS
android面试问题与答案
2016/12/27 面试题
本科毕业生自我鉴定
2013/11/02 职场文书
生日庆典策划方案
2014/06/02 职场文书
2015年毕业实习工作总结
2014/12/12 职场文书
小学少先队辅导员述职报告
2015/01/10 职场文书
nginx内存池源码解析
2021/11/20 Servers