When a user clicks on the img at the end of the following "li", I want to get the value of the hidden input two elements previous.
<ul id="theLists">
<li>
<input class="checkbox" type="checkbox" name="row"/>
<input class="contentId" type="hidden" value="64" name="id"/>
<div id="64" class="editable">Peanuts for me</div>
<img src="/img/delete.gif" alt="delete"/>
</li>
</ul>
I tried this:
$(document).ready(function(){
$("#theLists img").click(function(){
var contentId = $(this).closest("input[name='id']").val();
});
To no avail. Any Ideas? I need to set a var with the row id, which in this case is "64".
closest(...) gets the closest parent node, not the closest sibling.
There are, in fact, multiple ways to do what you want.
Try these:
var contentId = $(this).siblings("input[name='id']").val();
var contentId = $(this).parent().children("input[name='id']").val();
var contentId = $(this).prev().prev().val();
You can move the id
attribute to the containing <li>
, remove the hidden field and just use:
var contentId = $(this).parent().get(0).id;
The advantage here is that in the future you can add other actions, like "edit", etc. without a need to worry about a sibling's position.
好又便宜:
var contentId = $(this).parents('li:first').find('.contentId').val();
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.