Question

我有一个div，我们称之为class =“phoneNo”。在div里面有两个链接，一个是添加另一个div就像它一样，另一个是删除div本身。我正在尝试创建一个循环，如果只有这些div中的一个，“删除”链接应该隐藏，如果这些div中有多个，则“删除”链接应该显示在所有div上。

到目前为止，我想出了这个，但没有成功：

var pCount = $(".phoneNo").length;
                $(pCount).each(function(){
                    if (pCount <= 1) {
                        $("a.deleteThis").hide();
                     } 
                     else if (pCount >= 1) {
                        $("a.deleteThis").show();
                     }
                     return true;
                });

编辑（3.21.10）：

根据jWhiz在下面的建议，我重写了我所拥有的。代码没有错误，一切正常，除了隐藏/显示“删除”链接。

这是我的代码（有些问题与问题无关，但可能有助于修改我的逻辑流程）：

function checkHide() {
                    if ($(".phoneNo").length == 1)
                      $(".deleteThisPhone").hide();
                    else
                      $(".deleteThisPhone").show();
                  }
                //adding and deleting phone numbers in popup
                $(".addNewPhone").live("click", function(){
                    clicked = $(this);
                    grandFather = clicked.parent().parent();
                    cloneCurr = grandFather.clone(true).find("input").each(function(){
                        $(this).val("")        
                    }).end().animate({opacity:"show"})
                    grandFather.after(cloneCurr)
                    checkHide();
                    newHeight = $("#fancybox-wrap").height();
                    $('#fancybox-wrap').css({"height": newHeight + 66 + "px" });
                        return false
                });
                $(".deleteThisPhone").live("click",function(){
                    $(this).parent().parent().slideUp(150);
                    newHeight = $("#fancybox-wrap").height();
                    $('#fancybox-wrap').css({"height": newHeight - 66 + "px" });
                    checkHide();
                });

Answer 1

您的代码的问题在于您将int存储到pCount中，然后尝试获取该int的jQuery对象。我会想到它有点不同。请记住，您可以使用空格链接您的选择器，以将它们放在父母的范围内。

if ($(".phoneNo").length == 1)
  $(".phoneNo a.deleteThis").hide();
else
  $(".phoneNo a.deleteThis").show();

<强>更新

确保每次创建或删除手机时都运行上述逻辑。

<div class="phoneNoCollection">
  <div class="phoneNo">
    <input type="text" name="phoneNo" value="123 456 7890"/>
    <a class="deleteThis">Delete</a>
    <a class="add">Add another</a>
  </div>
</div>

<script type="text/javascript">
  $(function() {
    // initial setup
    $(".phoneNo .deleteThis").click(removeParent);
    $(".phoneNo .add").click(appendPhoneNo);
    checHide();
  });

  function checkHide() {
    // logic from above
    if ($(".phoneNo").length == 1)
      $(".phoneNo a.deleteThis").hide();
    else
      $(".phoneNo a.deleteThis").show();
  }

  function removeParent(e) {
    $(e.target.parent).remove();
    checkHide();
  }

  function appendPhoneNo() {
    var el$ = $("<div class='phoneNo'><input type='text' name='phoneNo'/>" + 
      "<a class='deleteThis'>Remove</a><a class='add'>Add another</a></div>"));
    $el.child(".deleteThis").click(removeParent);
    $el.child(".add").click(appendPhoneNo);
    $el.appendTo(".phoneNoCollection");
    checkHide();
  }
</script>

Answer 2

$（pCount）.each不会是一个有效的选择器，它是一个长度的整数。

$(".phoneNo").each(...

在创建div时循环遍历新div

2 个答案: