无法添加和删除Div到文档

时间:2015-08-21 05:25:08

标签: javascript jquery html dom

我无法使用此代码。它应该是一个自定义对话框。当某个事件发生时,div会弹出一个动画,就像它从远处向你移动一样。 div有一个可点击的链接,可以在点击时触发删除框。

它适用于一次迭代,但当我再次尝试触发它时,整个事情以可怕的方式崩溃。控制台不会发出任何警告或错误,但浏览器冻结然后崩溃。

任何帮助将不胜感激。

function modalBoxOpen(left, top, width, height, string, element){

var x = $('<div></div>').prependTo(element);

x.attr("id", "pop_up_div");

x.css("position", "absolute");

x.css("border-color", "black");

x.css("border-style", "solid");

x.css("background-color", "rgb(204, 204, 204)" );

x.css("padding", 0 + "%");

x.css("z-index", 10);

var y = $('<div>' + string + '</div>').prependTo(x);

y.attr("id", "inner_pop_up_div");

y.css("text-align", "center");

y.css("font-family", "arial");

y.css("position", "absolute");

y.css("margin", "1%");

y.css("width", "98%");

y.css("height", "93%"); y.css("background-color", "red");

var l = left + .5*width; 

var t = top + .5*height;

x.css("left", l + "px");

x.css("top", t + "px");

x.css("width", 2*(left + .5*width - l) + "px"); 

x.css("height", 2*(top + .5*height - t) + "px");

y.css("font-size", .0413*2*(left + .5*width - l) + "px");

$('<div style = "background-color: black; border-radius: 10px; padding                    

:   1%; margin-top: 1%; margin-left: 43%; margin-right: 43%">' +

'<a class = "link" id = "ok_button" href = "javascript:;"> OK </a>

</div>').appendTo(y);



okButtonClick = function(e){ 

  e.stopPropagation();     

  removeElement('pop_up_div');

  $(".input_cover").css("display", "none");

  bindHandlers();

  if ( $("#language_list_container").is(":visible") )

  {$("#language_clickable").click();}

  }

  $("#ok_button").bind("click", okButtonClick);


  var count = 0;

  timer = setInterval(open, 40);

  function open(){

  if ( count > 4 ) { 

     clearInterval(timer);

     bindHandlers();

     return;

   }

   l -= .1*width;

   t -= .1*height;

   x.css("left", l + "px");

   x.css("top", t + "px");

   x.css("width", 2*(left + .5*width - l) + "px"); 

   x.css("height", 2*(top + .5*height - t) + "px");

   x.css("border-radius", 2*(count+1) + "px");

   y.css("font-size", .0413*2*(left + .5*width - l) + "px");

   count++;

   }

   }

   function removeElement(id) {
   return          

   (elem=document.getElementById(id)).parentNode.removeChild(elem);
   }

0 个答案:

没有答案