在jQuery中相当于.parent().parent().siblings()的方法是什么？

Question

我一直在努力寻找正确的选择器，现在通过.parent().parent().siblings()才使得它正常工作，但我知道一定有更好的方法来避免过多地使用链式调用。

这个div是动态添加的，这是我发现的唯一可靠的选择它的方法：

var current = $(".filename:contains('" + file.name + "')").parent().parent().siblings();
current.find("input[name=title]").val(obj.file_name);

这是 jsFiddle 链接：http://jsfiddle.net/Msnf9/8/ 这是 HTML 代码：

<div id="uploadifive-fileupload-queue" class="uploadifive-queue">
    <div class="uploadifive-queue-item" id="uploadifive-fileupload-file-0">
        <div class="span12 well">
            <div class="row-fluid">
                <div class="alert">
                    <div class="filename">file-name-1.jpg</div>
                    <div class="fileinfo"> - Completed</div>
                </div>
                <div class="progress">
                    <div class="bar"></div>
                </div>
            </div>

            <div class="row-fluid inputs">
                <div class="span3">
                <ul class="thumbnails">
                    <li class="span12">
                      <a href="#" class="thumbnail">
                        <img src="http://placehold.it/260x180" alt="">
                      </a>
                    </li>
                  </ul>
                </div>
                <div class="span9">
                    <form class="form-horizontal">
                        <fieldset>
                            <div class="control-group">
                                <label class="control-label" for="file-name">File Name</label>
                                <div class="controls">
                                    <span class="input-xlarge uneditable-input file-name" /></span>
                                </div>
                            </div>
                            <div class="control-group">
                                <label class="control-label" for="file-dimensions">File Dimensions</label>
                                <div class="controls">
                                    <span class="input-xlarge uneditable-input file-dimensions" /></span>
                                </div>
                            </div>
                            <div class="control-group">
                                <label class="control-label" for="file-url">File URL</label>
                                <div class="controls">
                                    <span class="input-xlarge uneditable-input file-url" /></span>
                                </div>
                            </div>
                            <div class="control-group">
                                <label class="control-label" for="alt-text">Alt Text</label>
                                <div class="controls">
                                    <input type="text" class="input-xlarge" placeholder="Alt text" name="alt-text" id="alt-text" />
                                </div>
                            </div>
                            <input type="hidden" name="image_id" />
                            <div class="form-actions">
                                <button id="save" type="button" class="btn btn-primary"><i class="icon-ok icon-white"></i> Save</button>
                                <button id="delete" type="button" class="btn btn-inverse"><i class="icon-trash icon-white"></i> Delete</button>
                         </fieldset>
                    </form>
                </div>
            </div>
        </div>
    </div>
</div>

- Motive

---

.grandUncles()？哈哈，看起来好像需要编写一个jQuery插件来实现它。 :D - amsprich

Answer 1

您可以使用 closest() 方法：

从当前元素开始，向上遍历 DOM 树，获取与选择器匹配的第一个元素。

var current = $(".filename:contains('" + file.name + "')").closest('.row-fluid').siblings();

- Ram

---

这实际上不能与.control-group一起使用。另一个答案可以与.row-fluid一起使用。 - Motive

Answer 2

使用closest()方法，它会返回元素在DOM中最近的祖先。由于您拥有所需父级的类row-fluid，因此可以使用它来找到所需的父级。 Live Demo

var current = $(".filename:contains('file-name-1.jpg')").closest('.row-fluid').siblings();

- Adil

Answer 3

我喜欢最近的，然后是子元素。

var current = $(".filename:contains('" + file.name + "')").closest('.row-fluid').siblings()

- Split Your Infinity