删除并重新创建一个对象jquery

时间:2015-10-07 12:50:12

标签: jquery

我创建这段代码以“分离”和“重新附加”我的项目,但它不起作用。

为什么?

$( "#ciao" ).remove();


$('#condizionale').on('change', function() {
  if ($('#velux').is(':selected')) {
    var el = $('#sel-destination-tour').detach();
  }; 
});

$('#condizionale').on('change', function() {  
   if ($('#zanzariera').is(':selected')) {
     $('#sel-destination-tour').append(el);
   };
});

我想在选择“velux”时删除该项目,并在选择“zanzariera”时重新创建它。

小提琴:http://jsfiddle.net/dxq3msht/1/

2 个答案:

答案 0 :(得分:2)

那是因为el是第一个事件处理程序的局部变量,即在你的第二个#condizionale变更处理程序中,这样的变量不存在而且你将获得ReferenceError。在外部上下文中定义变量。

另一个问题是在第二个处理程序中使用$('#sel-destination-tour').append(el)。在分离查询后,将返回一个空集,因为DOM中没有分离的元素。请改用el元素及其.appendTo方法。将元素附加到元素本身也没有多大意义。你应该(重新)将元素附加到它的目标父元素。

var el;
$('#condizionale').on('change', function() {
  if ($('#velux').is(':selected')) {
     el = $('#sel-destination-tour').detach();
  }; 
});

$('#condizionale').on('change', function() {  
   if ($('#zanzariera').is(':selected') && el) {
     el.appendTo('#targetElement');
   };
});

另请注意,在这种情况下,您不需要定义2个更改处理程序。您可以将第二个处理程序的逻辑移动到第一个处理程序中并删除第二个处理程序。

答案 1 :(得分:0)

你可以像这样使用

$( "#ciao" ).remove();

$('#condizionale').on('change', function() {
  var el;	//variable declared out side off the both conditions.    
  if ($('#velux').is(':selected')) {
     el = $('#sel-destination-tour').detach();
  }else if($('#zanzariera').is(':selected')){        
     $('#sel-destination-tour').append(el);   
  };    
});