ID для каждого элемента JavaScript и PHP
<a class = "glyphicon glyphicon-heart-empty" style = "font-size: 50px;color: red" id = "'.$item['id'].'" onclick = "changeH()"></a>
<script type = "text/javascript">
function changeH() {
if (document.getElementById('<?php echo $item['id'];?>').className == "glyphicon glyphicon-heart")
document.getElementById('<?php echo $item['id'];?>').className = "glyphicon glyphicon-heart-empty";
else {
document.getElementById('<?php echo $item['id'];?>').className = "glyphicon glyphicon-heart";
}
}
</script>
Я хочу, чтобы в каждом элементе отображалось пустое сердечко, И когда я щелкнул по одному из них, отобразилось полное сердечко. У меня это работает, только когда я создаю символ или целочисленный идентификатор, но не с PHP.
Помоги мне, пожалуйста !!!
![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)
Ответы 1
Вы подходите к этому совершенно неправильно. Вы создаете новый тег <script> для каждой ссылки и продолжаете перезаписывать функцию changeH() новой функцией, специфичной для последней созданной вами ссылки.
Вместо этого попробуйте что-нибудь вроде этого:
<?php foreach($links as $item): ?>
<a class = "glyphicon glyphicon-heart-empty" style = "font-size: 50px;color: red" id = "<?php echo $item['id']; ?>" onclick = "changeH(this);"></a>
<?php endforeach; ?>
<script>
function changeH(link) {
if (link.className == "glyphicon glyphicon-heart") {
link.className = "glyphicon glyphicon-heart-empty";
}
else {
link.className = "glyphicon glyphicon-heart";
}
}
</script>
Я бы посоветовал почитать об обработке событий JavaScript в MDN. (Вы также можете лучше реализовать изменение класса CSS, но сейчас это не является предметом рассмотрения этого вопроса)
Это нормально, дело не в foreach. Дело в том, чтобы иметь только один тег <script>, в котором вы определяете функцию changeH, и вызывать эту функцию из обработчика событий всех тегов <a>, передавая this в качестве параметра. Вам даже не нужны идентификаторы (по крайней мере, для изменения значка).
у меня уже есть foreach для отображения других столбцов из элемента таблицы: /