Geek Answers Handbook

Equivalent to .parent (). Parent (). Siblings () in jQuery

It was hard for me to get the right selector, and I just got it by doing .parent().parent().siblings() , but I know that there should be a better way to get it without clinging to it so much.

Dynamite is added dynamically, and this is the only reliable way I found to select it:

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

This is the jsFiddle link: http://jsfiddle.net/Msnf9/8/

This is 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>
+4
source share
3 answers

Use the nearest () method, it gives you the closest ancestor of an element in the DOM. Since you have a row-fluid class with the desired parent, which is used to reach the desired parent.

Live demo

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

You can use the closest() method:

Get the first element that matches the selector, starting from the current element and evolving through the DOM tree.

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

I like the coming ones, and then the kids.

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

More articles:


All Articles