<html lang="en-US">
<head>
<meta charset="UTF-8">
<title>menu</title>
<style type="text/css">
</style>
<script type="text/javascript" src="jquery-1.8.0.min.js"></script>
<script type="text/javascript">
$ (function ()
{
var sum = 5
var funny = function (x)
{
$ ("#id" + x).on ('click', function ()
{
alert ($ (this).attr ("id"))
})
}
$ ("div").on ("keyup", function ()
{
for ( var x = 1x <= sumx++)
{
funny (x)
}
})
})
// 只要绑定一次就可以,而且必须绑定一次,正常需求下。
// 如上:每次div键盘谈起,就绑定事件,事件累加绑定,导致效率低下,结果很大概率出错。
// jquery选择器,包括 以id开头的id的dom元素的获取方法
// $("*[id^=id]").each (function (i, dom){
// var me = $(this), idx = me.attr ("id").replace(/[^\d]/g,'')
// if (idx >= 1 &&idx <= sum)
// {
//// TODO
// }
//})
// 无论如何都不需你那样做。好自为之
</script>
</head>
<body>
<div>ddddddddddddd</div>
<span id="id1">aaaaaaaaaaaa</span>
<span id="id2">aaaaaaaaaaaa</span>
<span id="id3">aaaaaaaaaaaa</span>
<span id="id4">aaaaaaaaaaaa</span>
<span id="id5">aaaaaaaaaaaa</span>
</body>
</html>
方法如下:1.页面载入完毕响应事件
所谓页面载入完毕是指DOM元素载入就绪了,能够被读取和 *** 作了。
①jQuery中的$(doucument).ready()事件
ready(fn)是jQuery事件模块中最重要的一个函数。这个方法可以看作是对window.onload注册事件的替代方法。通过使用这个方法,可以在DOM载入就绪时立刻调用所绑定的函数,而几乎所有的javaScript函数都是需要在那一刻执行。
ready(fn) 返回值:Object 参数-fn:要在DOM载入就绪时执行的参数Function 当DOM载入就绪时绑定一个要执行的函数
而它有一种很简单的缩写形式$(document).ready(function(){}) =>$(function(){})
②window.onload()事件和$(document).ready()事件的比较
window.onload()=function(){}
如果使用多个window.onload(),则只有最后一个绑定的函数能被执行,它将覆盖前面所有window.onload()绑定的函数。
如果使用多个$(),则它们都能被执行。
需要注意的是如果<body onload>body标签的onload事件已经注册了某个函数 则$()事件注册的函数将不会被执行
2.绑定与反绑定事件监听器
①绑定事件
⑴bind(type,[data],fn)函数
就是将某函数与某元素的某事件绑定在一起 $("#id").click(function(){})就是将一个匿名函数与id元素的click事件绑在一起
但上面的例子其实只是缩写形式,因为其是简单常用的事件绑定,正规写法应如下:
$("#id").bind("click",[data],function(){})
bind(type,[data],fn) 返回值:Object 参数-type:事件类型String data:可选,作为event.data属性值传递给后面fn的实参Object fn:绑定到事件上的函数Function
⑵为处理函数传递参数
这里用到bind()函数的第二个参数及event.data属性为fn函数传递参数
代码如下:
<input id="Text2" type="text" />
$("#Text2").bind("click",{first:"1",second:"2"},function(event){
if(event.data.first=="1"){$(this).val("欢迎光临")}
if(event.data.second=="1"){$(this).val("")}
})
})
你最终的目的应该是想在input按钮上加入点击事件吧,点击后将input的值写入cookie吧,这样
的话,给tr加事件是没有意义的,下面的代码在不引用任何构架的前提下实现的,没有使用jquery
也没有使用ExtJS,相对比较麻烦些,希望你能看懂,如果用jquery的话,更简单了,这里就不写了
function writeCookie(name, value) {// 写入cookie的代码你自己去实现
}
var rows = new Array() // 这个表格行的数组你自己组织吧,我这里只是定义一个简单的js数组,你可以从后台取这个值
// 先生成HTML代码,输出到网页上,这样才用JS绑定事件
var strHTML = ''
for(var i=0 i<rows.length i++) {
strHTML='<tr>' +
'<td><input id='btn_" + i + "' type="hidden" value='" + rows[i].id + "' /></td>' +
'<td>无关紧要的内容</td>' +
'</tr>'
}
document.writeln(strHTML)
// 绑定事件
for (var i=0 i<rows.length i++) {
var btnName = 'btn_' + i
var e = document.getElementById(btnName) // 循环取出每个按钮对象
var value = e.value // 取出按钮的值
e.onclick = function() {
writeCookie(btnName, value) // 以btnName作为键名,将按钮的值写入cookie
}
}
欢迎分享,转载请注明来源:内存溢出
评论列表(0条)