0

我有一个页面,需要可以添加然后删除添加的 div。div 不能隐藏,因为它应该包含设置,所以当删除 div/div = 时,这个 div/div 中的设置也会被删除。加载/添加的 div 是:#settings1 #settings2 #setting3.

在页面中有一个应该添加 div 的按钮(例如:单击 3 次添加#settings1 #settings2 #settings3

<a href="" class="design_button">Click here to add more divs</a>

然后有一个 div#settings1 #settings2 #settings3在加载时应该接收内容():

<div id="this_div_contains_settings">Here the #settings gets loaded in, then deleted if its not needed anymore</div>

然后在另一个页面(content.html)中有包含设置的 div #settings:

<div id="settings1">Some forms etc.</div>
<div id="settings2">Some forms etc.</div>
<div id="settings3">Some forms etc.</div>

在这些 div 中有一个按钮,可以在添加特定 div 后将其删除。

<a href="" class="design_button">Remove this div</a>

基本上:单击“单击此处添加更多 div”按钮将多个#settingsdiv 添加到 div#this_div_contains_divs中。点击 div 中的“Remove this div”按钮,#settings可以删除当前的 div。

我做了一张图片来描述我的意思:http: //imgur.com/DVPSR

我需要一些帮助:

通过单击按钮加载内容#settings1 #settings2 #settings3#this_div_contains_settings然后通过单击该 div 中的按钮删除当前 div。

我希望有人可以帮助我解决这个问题。谢谢。

4

1 回答 1

0

为 index.html 页面使用 jQuery 看起来像这样:

HTML:

<a href="#" class="design_button add">Click here to add more divs</a>
<div id="this_div_contains_settings"></div>

jQuery(您需要加载高于 1.7.2 的 jQuery 版本才能使 on() 工作):

$(function(){
   var number = 1;
   $('a.add').click(function(e){
      e.preventDefault();
      $('#this_div_contains_settings').append('<div id="settings'+number+'">Some forms etc.<a href="#" class="design_button">Remove this div</a></div>');
      number++;
   });
   $('#this_div_contains_settings').on('click','a.design_button', function(e){
      e.preventDefault();
      $(this).parent().remove();
   });
});

在这里工作小提琴:http: //jsfiddle.net/WdcTK/

然后将数据添加到 cookie 仍然...

于 2013-01-02T23:27:33.240 回答