码迷,mamicode.com
首页 > Web开发 > 详细

JQuery 动态 让 input 跟着 td 宽度   增长   js文件

时间:2017-08-14 22:24:46      阅读:186      评论:0      收藏:0      [点我收藏+]

标签:jquery 动态 让 input 跟着 td 宽度   增长   js文件

<html>

<head>

<script type="text/javascript" src="admin/js/jquery.min.js"></script>


<body>

<table id="c1" width="98%" border="1px" cellspacing="0" cellpadding="0" >

<tr>

   <td><input name="t1" value="aa1" /></td>

   <td id="c2">2</td>

   <td>3</td>

  </tr>

<tr>

<td><input class="test1" id="test1" border="1px"  onkeypress="demo1()" type="text" /></td>

<td><input class="test1" id="test2" onkeypress="demo1()" type="text" /></td>

<td><input class="test1" id="test3" onkeypress="demo1()" type="text" /></td>

</tr>

<tr>

<td>dd</td>

<td>dd</td>

<td>dd</td>

</tr>

<tr>

<td>dd</td>

<td>dd</td>

<td>dd</td>

</tr>

</table>

</body>

<script>

//jQuery代码

function demo1() {

//var dd = document.getElementsByName(‘t1‘)[0].value;//通过名字,得到input中值,遍历是从0开始的

//var testLength = document.getElementById(‘test1‘).value.length;

var testLength = document.getElementById("c1").rows[0].cells[0].offsetWidth;   //表格中id,table中第一行  第一列

alert("宽度为:" + testLength);

$(‘.test1‘).css(‘width‘, testLength*5 + ‘px‘)//点表类,#表id    动态设置input框长度

}

</script>

</html>


本文出自 “Exist” 博客,请务必保留此出处http://exist.blog.51cto.com/10305882/1956238

JQuery 动态 让 input 跟着 td 宽度   增长   js文件

标签:jquery 动态 让 input 跟着 td 宽度   增长   js文件

原文地址:http://exist.blog.51cto.com/10305882/1956238

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!