请问下,为什么jquery添加div后,后面的div总显示在前面,如图,让添加到显示到最前面该怎么做呢,z-index好像不行,
而且加了后下面的input无法编辑,请帮看看多谢啦
HTML
<html> <head> <title>面面面面</title> <script type="text/javascript" src="jquery.js" ></script> <script type="text/javascript" src="drop.js" ></script> <style> .dropBox_div{ border:2px solid blue; width:400px; height:200px; background:white; /*没有这个就透明了*/ position:absolute; left:10%; top:0; } </style> </head> <body> <div class='inputdiv' id='div1' style="position:relative;"> <input id='d1' ></input> </div> <div class='inputdiv' id='div2' style="border:1px solid red;position:relative;"> <input id='d2' ></input> </div> <div class='inputdiv' id='div3' style="position:relative;"> <input id='d3' ></input> </div> </body> </html>
js
$(document).ready( function(){ $(".inputdiv").mousedown( function(){ var thisID = $(this).attr("id"); var dropBox_ID = "box_"+ thisID; var $dropBox_div = $("<div/>"); $dropBox_div.attr("id",dropBox_ID).attr("class","dropBox_div"); $("#"+thisID).after($dropBox_div); }); } );