嘿所有我都有一个从这些img src中选择的javascript并显示在一个更大的图像容器中。我现在需要做的是获取所选图像的标题并将其传递给表单输入。
这是div:
<div class="imgcontainer" id="imgch">
<div class="minicontainer">
<img src="bl.jpg" title="blue paper" class="miniimg" />
<img src="grey.jpg" title="grey paper" class="miniimg2" />
<img src="vel.jpg" title="velum paper" class="miniimg3" />
<img src="wht.jpg" title="white paper" class="miniimg" />
</div>
</div>
这是我尝试使用的java脚本:
<script>
$('#imgch').bind('change click keyup', function() {
$('#imgchange').val($(this).val());
});
</script>
以及我希望它最终形成的形式:
<input type="text" name="imgchan" id="imgchange"><br>
我假设我需要使用类似的脚本,但指示它专门采用标题,但我不确定如何。
一如既往地帮助大家赞赏: - )
答案 0 :(得分:2)
您可以使用事件的target属性来获取实际点击的图片:
$(function () {
$('#imgch').bind('change click keyup', function(e) {
$('#imgchange').val($(e.target).attr('title'));
});
});
请参阅demo
答案 1 :(得分:1)
关注容器中图片的点击次数:
$('#imgch').on('click', 'img',
function() {
$('#imgchange').val( $(this).attr('title') );
}
);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="imgcontainer" id="imgch">
<div class="minicontainer">
<img src="bl.jpg" title="blue paper" class="miniimg" />
<img src="grey.jpg" title="grey paper" class="miniimg2" />
<img src="vel.jpg" title="velum paper" class="miniimg3" />
<img src="wht.jpg" title="white paper" class="miniimg" />
</div>
</div>
<input type="text" name="imgchan" id="imgchange"><br>