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 相关文章推荐
JQuery 构建客户/服务分离的链接模型中Table中的排序分析
Jan 22 Javascript
js使用正则实现ReplaceAll全部替换的方法
Jul 18 Javascript
jQuery入门介绍之基础知识
Jan 13 Javascript
json+jQuery实现的无限级树形菜单效果代码
Aug 27 Javascript
js获取鼠标位置实例详解
Dec 09 Javascript
JS代码随机生成姓名、手机号、身份证号、银行卡号
Apr 27 Javascript
vue2.0实战之使用vue-cli搭建项目(2)
Mar 27 Javascript
webpack配置打包后图片路径出错的解决
Apr 26 Javascript
浅谈angularJS2中的界面跳转方法
Aug 31 Javascript
Vue表单输入绑定的示例代码
Nov 01 Javascript
express+vue+mongodb+session 实现注册登录功能
Dec 06 Javascript
js实现拾色器插件(ColorPicker)
May 21 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使用eAccelerator的API开发详解
2013/06/09 PHP
合并ThinkPHP配置文件以消除代码冗余的实现方法
2014/07/22 PHP
jquery 简单图片导航插件jquery.imgNav.js
2010/03/17 Javascript
JQuery 文本框使用小结
2010/05/22 Javascript
30个最佳jQuery Lightbox效果插件分享
2011/04/11 Javascript
javascript 弹出窗口中是否显示地址栏的实现代码
2011/04/14 Javascript
20个最新的jQuery插件
2012/01/13 Javascript
javascript检测页面是否缩放的小例子
2013/05/16 Javascript
对象转换为原始值的实现方法
2016/06/06 Javascript
JS回调函数基本定义与用法实例分析
2017/05/24 Javascript
angular.js中解决跨域问题的三种方式
2017/07/12 Javascript
解决Vue编译时写在style中的路径问题
2017/09/21 Javascript
说说node中的可读流和可写流的区别
2018/06/01 Javascript
微信小程序自定义tabBar组件开发详解
2020/09/24 Javascript
发布一款npm包帮助理解npm的使用
2019/01/03 Javascript
深入理解JS异步编程-Promise
2019/06/03 Javascript
微信小程序如何利用getCurrentPages进行页面传值
2019/07/01 Javascript
javascript实现贪吃蛇小游戏
2020/07/28 Javascript
JavaScript实现下拉列表
2021/01/20 Javascript
[02:40]DOTA2英雄基础教程 先知
2013/11/29 DOTA
python将文本转换成图片输出的方法
2015/04/28 Python
AI人工智能 Python实现人机对话
2017/11/13 Python
Flask之flask-script模块使用
2018/07/26 Python
python创建文件备份的脚本
2018/09/11 Python
python实现简单文件读写函数
2021/02/25 Python
CSS3 选择器 属性选择器介绍
2012/01/21 HTML / CSS
英国户外服装品牌:Craghoppers
2019/04/25 全球购物
Linux中如何设置Java环境变量(Ubuntu)
2016/07/24 面试题
文秘自荐信
2013/10/20 职场文书
装修致歉信
2014/01/15 职场文书
中班开学寄语
2014/04/04 职场文书
感恩之星事迹材料
2014/05/03 职场文书
大专生自我鉴定怎么写
2014/09/16 职场文书
小学教师师德师风自我剖析材料
2014/09/29 职场文书
vue报错function () { [native code] },无法出现我们想要的内容 Unknown custom element
2022/04/11 Vue.js
在虚拟机中安装windows server 2008的图文教程
2022/06/28 Servers