Javascript 相同的id和类出现在不同的div上,但它们都是不同的
当我点击显示自己id或类的数字时,我得到了这个结果,但它总是相同的,当我在控制台上写childrenImg时,所有id和类都不同,我也想让它工作,所以我将图像替换为另一个,但再一次,它不工作,我不知道为什么,收到了任何想法Javascript 相同的id和类出现在不同的div上,但它们都是不同的,javascript,html,jquery,class,Javascript,Html,Jquery,Class,当我点击显示自己id或类的数字时,我得到了这个结果,但它总是相同的,当我在控制台上写childrenImg时,所有id和类都不同,我也想让它工作,所以我将图像替换为另一个,但再一次,它不工作,我不知道为什么,收到了任何想法 let childrenBoth = $('div[class^="fila"], div[class^="pieceRow"]').children(); let childrenImg = $('div[class^="f
let childrenBoth = $('div[class^="fila"], div[class^="pieceRow"]').children();
let childrenImg = $('div[class^="fila"]').children()
$(childrenBoth).on('click', function () {
var classes = $(this).attr('class')
let idImg = $(childrenImg).attr('id')
console.log(idImg)
let classImg = $(childrenImg).attr('class')
console.log(classImg)
$(classImg).attr('src', 'https://www.logocrea.com/2/wp-content/uploads/2016/07/cuadrado.png')})
html和其他内容都在处理中
div class="row ">
<div class="col-md-8 ">
<div class="card">
<div class="card-body">
<!-- <div class="card-title text-center p-2"><h5>Odontograma</h5></div> -->
<br>
<div class="pieceRow1">
<p class="pieza18" id="pieza18">18</p>
<p class="pieza17" id="pieza17">17</p>
<p class="pieza16" id="pieza16">16</p>
</div>
<div class="fila1 d-flex justify-content-leftr">
<div class="pieza18 "><img class="img-responsive" src="https://s3-us-west-2.amazonaws.com/s.cdpn.io/385126/600.jpg" alt="">
</div>
<div class="mr-3"></div>
<div class="pieza17"><img class="img-responsive" src="https://s3-us-west-2.amazonaws.com/s.cdpn.io/385126/600.jpg" alt="">
</div>
<div class="mr-3"></div>
<div class="pieza16"><img class="img-responsive" src="https://s3-us-west-2.amazonaws.com/s.cdpn.io/385126/600.jpg" alt="">
</div>
</div>
</div>
</div>
</div>
</div>
div class=“行”>
18
17
16
您的代码存在多个问题:
let childrenBoth = $('div[class^="fila"], div[class^="pieceRow"]').children();
$(childrenBoth).on('click', function() {
let idImg = $(this).attr('id')
let classImg = $(this).attr('class')
$(`div.${classImg}>img`).attr('src', 'https://www.logocrea.com/2/wp-content/uploads/2016/07/cuadrado.png')
})