Question

我正在尝试隐藏div，但如果该类只存在一次，我只想隐藏它。

这是html

<button class="clone">Clone</button> 
<div id="upload_image_sets">
  <div id="clonedInput1" class="clonedInput">
    <input type="text" id="upload_image_link_1" class="image" size="36" name="hero_options[upload_image_link_1]" value="' . $hero_options['upload_image_link_1'] . '" />
    <input id="show_upload_image_link_button_1" class="button upload_images" type="button" value="Upload Image" />
    <div class="actions">
      <button class="remove">Remove</button>
    </div>
  </div>
</div>

更新：

抱歉，我确实写了我想要隐藏的div，并且在粘贴代码时必须删除它，doh。

我试图隐藏删除按钮，如果它只显示一次，即如果我克隆表单并且存在2个表单，则显示删除按钮，如果只存在1个表单，则隐藏删除按钮。

希望这更清楚。

Answer 1

试试这个。

$(document).on("click", "button.remove", function(e){
    e.preventDefault();
    if( $(".clonedInput").length > 1){
        $(this).parents(".clonedInput").remove();
        $(this).show()
    } 
    if( $("button.remove").length < 2){
       $("button.remove").hide()
    } 
    $(".clonedInput").each( function (cloneIndex, clonedElement) {
        updateClonedInput(cloneIndex + 1, clonedElement);
    });
});
if( $(".clonedInput").length > 1){
        $('button.remove').show();
    }else {
        $('button.remove').hide();
}

Update Fiddle

Answer 2

也许你可以只测试$（'。clonedInput'）。长度仅在有多个元素删除时删除

 if($('.clonedInput').length>1){
            $(this).parents(".clonedInput").remove();
   }

为例 http://jsfiddle.net/n4g4q/

Answer 3

我想这就是你的意思：

$(document).on("click", "button.clone", function(e){
    e.preventDefault();
    var cloneIndex = $(".clonedInput").length + 1;
    var new_Input = $(".clonedInput").first().clone().show();//show because it may be hidden
    updateClonedInput(cloneIndex, new_Input);    
});
$(document).on("click", "button.remove", function(e){
    e.preventDefault();
    if( $(".clonedInput").length > 1 ) {//when more than one
        $(this).parents(".clonedInput").remove();
    }
    else{
        $(this).parents(".clonedInput").hide();//otherwise just hide
    }
    $(".clonedInput").each( function (cloneIndex, clonedElement) {
        updateClonedInput(cloneIndex + 1, clonedElement);
    })
});

http://jsfiddle.net/d8Tj8/34/

Answer 4

Thsi代码应该有效 -

$(document).on("click", "button.clone", function(e){
        e.preventDefault();
        var cloneIndex = $(".clonedInput").length + 1;
        var new_Input = $(".clonedInput").first().clone();
        updateClonedInput(cloneIndex, new_Input);  
        //alert(cloneIndex);
        if(cloneIndex>1){
            $('button.remove').show();
        }
    });
    $(document).on("click", "button.remove", function(e){
        e.preventDefault();
        var cloneIndex = $(".clonedInput").length;
        $(this).parents(".clonedInput").remove();
        $(".clonedInput").each( function (cloneIndex, clonedElement) {
            updateClonedInput(cloneIndex + 1, clonedElement);
        })
        //alert(cloneIndex);
        if(cloneIndex<=2){
            $('button.remove').hide();
        }
    });

我还更新了小提琴，它正是你想要的链接 -

http://jsfiddle.net/visittoravi/PqApF/2

如果存在多于一个类，则隐藏div

4 个答案: