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>

时间: 2024-10-19 03:38:55

JQuery 动态 让 input 跟着 td 宽度   增长   js文件的相关文章

jQuery动态添加input type=file文件上传域

jQuery动态添加input type=file文件上传域,当用户需要通过网页上传多个文件的时候,动态添加文件域就显得尤其重要,本功能引入了jQuery,兼容性方面也做的不错,暂时没有限制文件域的个数,所以你可以无限制的生成文件域,直到满足你的需要. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transit

#iOS问题记录#动态Html加载本地CSS和JS文件

所谓动态Html,指代码中组合生成的html字符串: 若需要加载本地CSS,图片,JS文件,则, 1,需要文件的全路径: 2,需要"file:///"标志: 例如: //获取文件全路径 NSString *imagePath = [[NSBundle mainBundle] pathForResource:@"[email protected]" ofType:@"png"]; //代码加载图片 [_mStrHtmlUrl appendForma

jQuery动态添加&lt;input type=&quot;file&quot;&gt;

有时候需要在页面上允许用户上传多个文件,个数由用户自己决定,个数多了也可以删除,使用jQuery可以很简单的实现这个功能. <!DOCTYPE html> <html> <head> <title>test.html</title> <meta http-equiv="content-type" content="text/html; charset=UTF-8"> <script typ

jQuery动态添加input,name值自增

function addLi(){ var listNum=$(".divList").length; var num= listNum == 0 ? 1: listNum+1 ; console.log(num); var divObj = '<div class="divList"><input class="small_input" placeholder="起始年份" name="start

ASP.NET动态引用样式表(css)和脚本(js)文件

// 引入js文件 HtmlGenericControl scriptControl = new HtmlGenericControl("script"); scriptControl.Attributes.Add("type", "text/javascript"); scriptControl.Attributes.Add("language", "JavaScript"); scriptControl

jQuery实用美化input 上传组建

下载插件 (5) 简要教程 jquery-filestyle是一款可以简单实用的表单文件上传域美化jQuery插件.该插件可以将表单的文件上传域转换为类似Bootstrap按钮组的样式.它提供了大量的data属性来控制文件上传域的样式,可以自定义按钮文本和图标等. 使用方法 使用该表单文件上传域美化插件需要引入jquery,jquery-filestyle.min.css和jquery-filestyle.min.js文件. <link href="css/jquery-filestyle

HTML+jQuery实现动态添加&lt;input&gt;输入框

一个html文件和一个js文件配合,在html文件里引入js文件,用jQuery为<a>标签添加一个点击事件,事件里只需写一个append函数就可以. HTML源码: 1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>Title</title> 6 <script sr

jquery动态添加删除一行数据

<html> <head> <title>添加.删除一行</title> <meta http-equiv="content-type" content="text/html; charset=UTF-8"> <script type="text/javascript" src="../js/jquery-1.9.1.js"></script>

jQuery动态创建html元素的常用方法汇总

在使用jQuery进行WEB程序设计的时候非常有用.分享给大家供大家参考.具体方法如下: 一般来说,可以通过以下几种方式动态创建html元素: 1.使用jQuery创建元素的语法 2.把动态内容存放到数组中,再遍历数组动态创建html元素 3.使用模版 1.使用jQuery动态创建元素追加到jQuery对象上. <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> <