第一次点击执行一次,第二次点击执行二次。是什么原因
代码如下:
<!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" /><script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js" type="text/javascript"></script><title>无标题文档</title><style type="text/css"> ul{ list-style-type:none;width:150px;float:left;} li{ list-style-type:none; width:150px; text-align:center;}</style><script type="text/javascript"> /* function load(){ var divs = document.getElementsByTagName("DIV"); for (var i=0;i<divs.length;i++){ alert(divs[i].id); } }*/ //左移 function moveLeft(obj){ //alert("divX=="+obj); var divX = "#"+obj; var divIDY=$(divX).prev().attr("id"); //alert("divIDY=="+divIDY); var divY="#"+divIDY; $(divX).insertBefore($(divY)); } //右移 function moveRight(obj){ var divX = "#"+obj; //alert("divX=="+obj); var divIDY=$(divX).next().attr("id"); var divY="#"+divIDY; //alert("divIDY=="+divIDY); $(divX).insertAfter($(divY)); alert($(divX).insertAfter($(divY))); alert("111"); } //删除 function deleteDiv(obj){ var divX="#"+obj; $(divX).remove(); } function Oper(obj){ //alert(obj); $('div').click(function() { //以下为重复执行的代码 var st = null; //alert(st); st =$(this).attr("id"); alert("st="+st); if(obj=="0"){ deleteDiv(st); }else if (obj=="1"){ moveRight(st); }else if(obj=="2"){ //alert("obj = "+obj); moveLeft(st); } }); } </script></head><body > <div> <div id="div1" > <ul> <li >aaaa1 <a onclick="javascritp:Oper('1');">>>></a> <a onclick="javascritp:Oper('0');">delete</a></li> <li >1</li> <li >1</li> <li >1</li> <li >1</li> <li >1</li> </ul> </div> <div id="div2"> <ul > <li ><a onclick="javascritp:Oper('2');" >左移</a> aaaa2 <a onclick="javascritp:Oper('1');">右移</a> <a onclick="javascritp:Oper('0');">delete</a></li> <li >2</li> <li >2</li> <li >2</li> <li >2</li> <li >2</li> </ul> </div> <div id="div3" > <ul> <li ><a onclick="javascritp:Oper('2');" >左移</a> aaaa3 <a onclick="javascritp:Oper('1');">右移</a> <a onclick="javascritp:Oper('0');">delete</a></li> <li >3</li> <li >3</li> <li >3</li> <li >3</li> <li >3</li> </ul> </div> <div id="div4"> <ul> <li ><a onclick="javascritp:Oper('2');" >左移</a> aaaa4 <a onclick="javascritp:Oper('1');">右移</a> <a onclick="javascritp:Oper('0');">delete</a></li> <li >4</li> <li >4</li> <li >4</li> <li >4</li> <li >4</li> </ul> </div> <div id="div5"> <ul> <li ><a onclick="javascritp:Oper('2');" >左移</a> aaaa5 <a onclick="javascritp:Oper('1');">右移</a> <a onclick="javascritp:Oper('0');">delete</a></li> <li >5</li> <li >5</li> <li >5</li> <li >5</li> <li >5</li> </ul> </div> <div id="div6"> <ul> <li ><a onclick="javascritp:Oper('2');" >左移</a> aaaa6 <a onclick="javascritp:Oper('1');">右移</a> <a onclick="javascritp:Oper('0');">delete</a></li> <li >6</li> <li >6</li> <li >6</li> <li >6</li> <li >6</li> </ul> </div> <div id="div7"> <ul> <li ><a onclick="javascritp:Oper('2');" >左移</a> aaaa7 <a onclick="javascritp:Oper('1');">右移</a> <a onclick="javascritp:Oper('0');">delete</a></li> <li >7</li> <li >7</li> <li >7</li> <li >7</li> <li >7</li> </ul> </div> </div> <em></em></body></html>
function Oper(obj){ //alert(obj); $('div').unbind('click').click(function()///////////////// { //以下为重复执行的代码 var st = null; //alert(st); st =$(this).attr("id"); alert("st="+st); if(obj=="0"){ deleteDiv(st); }else if (obj=="1"){ moveRight(st); }else if(obj=="2"){ //alert("obj = "+obj); moveLeft(st); } }); }