分离然后附加Div

时间:2014-10-28 15:03:12

标签: javascript jquery append detach

我一直在使用这个脚本,它的思维令人难以置信,因为它看起来应该可以正常工作,但事实并非如此。所以我向大家求助于额外关注我所缺少的东西。

情况:基本上,我要做的是点击分离div,然后当选择另一个单选按钮时,将div附加回其位置。

我已经包含了一个JSFiddle,所以你可以看到我可能不完全偏离轨道:http://jsfiddle.net/heykate/pusk6ezx/

在加载时,向用户显示两个选项,支持或充气,在支持尺寸上选择默认尺寸,其他模型尺寸隐藏。哪个好。我知道最终我想将第一行代码从hide()更改为detach()。

一旦我点击第二个样式选项,它会显示第二个模型的宽度,但是如果我要切换回第一个样式选项。我最初分离的div仍然是隐藏的,并且不会在我的代码中使用.append()。

以下是我的脚本:

$(document).ready(function(){
    $('#5e8a1520d82ed2834919fda63f4a3f84').hide();            
    $('input[type="radio"]').change(function(){
             if($(this).attr("value")=="489"){
                $( "#b6304c97422f08727702021e2c6c7cda" ).append( ".rightCol" );
                $("#5e8a1520d82ed2834919fda63f4a3f84").detach();                
              }
             if($(this).attr("value")=="488"){
                $("#b6304c97422f08727702021e2c6c7cda").detach();
                $("#5e8a1520d82ed2834919fda63f4a3f84").show();
            }
        });    
    });

请让我知道我错过了什么。基本上我开始这样做的原因是

  1. 为了减少前端的混乱和
  2. 因为设置了默认值(对于两种尺寸),它们会在产品订单信息中被混淆,所以如果我可以清除其他宽度选中的单选按钮或分离并防止它被看到,我认为它可以解决细。

1 个答案:

答案 0 :(得分:1)

.detach从DOM中删除元素。由于它不再在DOM中,当您稍后尝试.show()时,它不再在dom中,因此无法找到/可用。这就是.detach()返回您已删除的节点的原因,以防您想重新使用它:

foo = $('#blahblah').detach(); // 'foo' now contains the detached now

$('#otherplace').attach(foo);  // reinsert the foo element we detached.