admin管理员组文章数量:1313157
My Html goes like this,
<div>
<div>
<input id="20171" name="StyleID" type="checkbox" value="true"><input name="StyleID" type="hidden" value="false">
</div>
<div class="imgContainer" style="padding-left: 3px; font-size: 18px; float:left;">
<img src="http://localhost:61137/Images/8501.jpg" width="150px" height="150px">
</div>
<div>
<span id="1002" class="ImagePlating"></span>
<span id="1003" class="ImagePlating"></span>
<span id="1004" class="ImagePlating"></span>
<span id="1005" class="ImagePlating"></span>
</div>
</div>
...
<div >
<div >
<input id="20162" name="StyleID" type="checkbox" value="true">
<input name="StyleID" type="hidden" value="false">
</div>
<div class="imgContainer" style="padding-left: 3px; font-size: 18px; float:left;">
<img src="http://localhost:61137/Images/8498.jpg" width="150px" height="150px">
</div>
<div style="padding-left: 3px; font-size: 18px; float:left;">
<span id="1002" class="ImagePlating"></span>
<span id="1003" class="ImagePlating"></span>
<span id="1004" class="ImagePlating"></span>
<span id="1005" class="ImagePlating"></span>
<span id="1006" class="ImagePlating"></span>
<span id="1007" class="ImagePlating"></span>
</div>
</div>
On click of the span I am trying to change the source for the div with class "imgContainer", also trying to get the Id of the parent div's checkbox with the following Jquery.
$(".ImagePlating").on("click", function (e) {
$(this).parent()
.sibilings()
.find('.imgContainer')
.child()
.attr("src", "http://localhost:61137/Images/Img-Loading.gif");
var id = $(this).parent()
.find('input[type='checkbox']')
.attr('id');
});
However I am not sure how can I achieve that using JQuery, the above Jquery which I tried looks wrong.
My Html goes like this,
<div>
<div>
<input id="20171" name="StyleID" type="checkbox" value="true"><input name="StyleID" type="hidden" value="false">
</div>
<div class="imgContainer" style="padding-left: 3px; font-size: 18px; float:left;">
<img src="http://localhost:61137/Images/8501.jpg" width="150px" height="150px">
</div>
<div>
<span id="1002" class="ImagePlating"></span>
<span id="1003" class="ImagePlating"></span>
<span id="1004" class="ImagePlating"></span>
<span id="1005" class="ImagePlating"></span>
</div>
</div>
...
<div >
<div >
<input id="20162" name="StyleID" type="checkbox" value="true">
<input name="StyleID" type="hidden" value="false">
</div>
<div class="imgContainer" style="padding-left: 3px; font-size: 18px; float:left;">
<img src="http://localhost:61137/Images/8498.jpg" width="150px" height="150px">
</div>
<div style="padding-left: 3px; font-size: 18px; float:left;">
<span id="1002" class="ImagePlating"></span>
<span id="1003" class="ImagePlating"></span>
<span id="1004" class="ImagePlating"></span>
<span id="1005" class="ImagePlating"></span>
<span id="1006" class="ImagePlating"></span>
<span id="1007" class="ImagePlating"></span>
</div>
</div>
On click of the span I am trying to change the source for the div with class "imgContainer", also trying to get the Id of the parent div's checkbox with the following Jquery.
$(".ImagePlating").on("click", function (e) {
$(this).parent()
.sibilings()
.find('.imgContainer')
.child()
.attr("src", "http://localhost:61137/Images/Img-Loading.gif");
var id = $(this).parent()
.find('input[type='checkbox']')
.attr('id');
});
However I am not sure how can I achieve that using JQuery, the above Jquery which I tried looks wrong.
Share Improve this question edited Jul 18, 2014 at 9:35 zessx 68.8k29 gold badges138 silver badges164 bronze badges asked Jul 18, 2014 at 9:30 TBATBA 1,1975 gold badges46 silver badges83 bronze badges3 Answers
Reset to default 3Try below code : Use parent()
to get parent div and then use prev()
to find previous element with class="imgContainer"
and change src
. Use same $imageContainer
and prev() to find checkbox.
Also use double quotes for type="checkbox"
$(".ImagePlating").on("click", function (e) {
var $imageContainer = $(this).parent().prev('.imgContainer');
$imageContainer.find('img').attr("src", "http://localhost:61137/Images/Img-Loading.gif");
var id = $imageContainer.prev().find('input[type="checkbox"]').attr('id');
});
Use
$(".ImagePlating").on("click", function (e) {
$(this).parent()
.prev('.imgContainer') //Image container is not a sibling
.find('img')
.attr("src", "http://localhost:61137/Images/Img-Loading.gif");
var id = $(this).parent()
.find('input[type='checkbox']')
.attr('id');
});
You can use like this
$(".ImagePlating").click(function () {
$(this).parent().prev().find("img").attr("src", "new src");
});
.prev()
will select the element just above it. Then using find()
you can find the children.
本文标签: javascriptJquery to get parent div image sourceStack Overflow
版权声明:本文标题:javascript - Jquery to get parent div image source - Stack Overflow 内容由网友自发贡献,该文观点仅代表作者本人, 转载请联系作者并注明出处:http://www.betaflare.com/web/1741936046a2405861.html, 本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容,一经查实,本站将立刻删除。
发表评论