如何使用jQuery找到隐藏的div

时间:2014-10-16 11:51:18

标签: jquery

HTML

<div class="form-group">
    <div style="vertical-align:top;" class="ajax-upload-dragdrop">
    <span style="color: #B2B2B2;font-size: 18px; opacity: 1; margin-right:249px;" id="cv_founder">
    Upload Your CV
   </span>
        <div class="ajax-file-upload" style="position: relative; overflow: hidden; cursor: default;">Browse File
        </div>
    </div>
    <div class="form-control" id="founder_cv_file" style="display: none;">Browse File</div>
    <input type="hidden" id="founder_cv" name="data[Founder][0][cv]"> <em>*</em>
</div>

的jQuery

alert($(".ajax-upload-dragdrop").parent().find("div:hidden").attr("id"));  //Not work
alert($(".ajax-upload-dragdrop").parent().find("input[type=hidden]").attr("id"));  //Work fine

如何在给定代码中找到隐藏的div。我成功找到隐藏的输入但没有找到隐藏的div。请帮助我。

1 个答案:

答案 0 :(得分:1)

当您使用.parent().find()时,它会遍历.form-group,然后查找所有div:hidden个元素。如果您的div .ajax-upload-dragbox在视觉上被隐藏,它将返回该集合中的第一个元素。由于它没有ID,因此它将为该值返回undefined。您想使用.siblings()方法。这样您就不需要进行任何额外的遍历,也不会包含没有ID的.ajax-upload-dragdrop元素:

Updated Fiddle

alert($(".ajax-upload-dragdrop").siblings("div:hidden").attr("id"));

同样适用于您的input元素,因为此案例中的:hidden是指type属性:

alert($(".ajax-upload-dragdrop").siblings('input:hidden').attr("id"));

的简写
alert($(".ajax-upload-dragdrop").siblings('input[type="hidden"]').attr("id"));