jquery - 删除并重新创建对象jquery

Question

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

为什么？

$( "#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”时重新创建它。

fiddle :http://jsfiddle.net/dxq3msht/1/

Answer 1

这是因为 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 个更改处理程序。您可以将第二个处理程序的逻辑移至第一个处理程序中并删除第二个处理程序。