PHP foreach функция не работает с моим кодом jquery

0

Я написал этот код jquery:

$(document).ready(function(){

var info = $('.info').detach();

$('.des').click(function(){
    score = score + 1;
    played = played + 1;
    $('.kreis').addClass("borderGreen");
    $('.foto').hide();
    $('.kreis').append(info);
});

$('.pro').click(function(){
    played = played + 1;
    $('.kreis').addClass("borderRed");
    $('.foto').hide();
    $('.kreis').append(info);

    console.log('score:' + score);
    console.log('played:' + played);
});

$('.frage').mouseenter(function(){
    $(this).fadeTo(460, 0.7);
});

$('.frage').mouseleave(function(){
    $(this).fadeTo(350, 0);
});

});

добиться чего-то подобного !

то я написал следующий PHP-код для прокрутки этой "функции",

    <?php foreach ($objects as $object){ ?>

        <div class="kreis">
            <div class="info" >
                <div class="infobox">
                    <p style="padding-bottom:15px;border-bottom:1px solid #545454;"><?php echo $object["name"]; ?></p> <bl/>
                    <p style="font-weight:200;"><?php echo $object["position"]; ?></p>
                </div>
                <div class="social">
                    <a href="<?php echo $object["twitter"]; ?>"><img src="img/twitter.png" style="width:45px;margin-left:35px;padding-right:12px;"></a>
                    <a><img src="img/dribbble.png" style="width:45px;"></a>
                </div>
            </div>  
                <div class="foto" style="background-image:url('<?php echo $object["img"]; ?>'); ">
                    <div class="frage">
                        <div class="des box"><p>AAAAA</p></div>
                        <div class="pro box" style="margin-top:6%;"><p>BBBBB</p></div>
                    </div>
                </div>
        </div> <?php } ?>

Теперь проблема в том, что если вы нажмете объект.des или.pro, jquery скрывает слой каждого объекта. Есть ли способ, которым я могу достичь того, что я хочу делать с jquery, или мне нужно использовать javascript или какой-либо другой язык? Какой самый элегантный способ решить эту проблему?

  • 0
    C так далеко от этого ... c тег удален
  • 0
    У вас есть только одна переменная, содержащая отдельный элемент .info, поэтому она никогда не будет работать с несколькими экземплярами разметки, описанной выше, независимо от того, как вы ее закручиваете и поворачиваете.
Показать ещё 2 комментария
Теги:
class

1 ответ

1

jQuery идеально подходит для этой работы. Вы можете пойти с ним. Но вы должны изменить, что изменяется только текущий объект в прослушивателе кликов, а не все ваши объекты. Попробуй это:

$('.des').click(function(){
    var $this = $(this);

    score = score + 1;
    played = played + 1;
    $this.closest('.kreis').addClass("borderGreen").append(info);
    $this.closest('.foto').hide();
});

$('.pro').click(function(){
    var $this = $(this);

    played = played + 1;
    $this.closest('.kreis').addClass("borderRed").append(info);
    $this.closest('.foto').hide();

    console.log('score:' + score);
    console.log('played:' + played);
});
  • 0
    спасибо за вашу помощь, но теперь информационный класс добавляется к каждому объекту, а не только к ближайшему.
  • 0
    нет, он будет добавлен только к ближайшему элементу с классом kreis из-за цепочки функций. Взгляните на w3schools.com/jquery/jquery_chaining.asp . Кстати, экземпляр dom может быть только дочерним по отношению к одному родительскому объекту dom. Поэтому невозможно, чтобы в дереве dom было несколько элементов одного экземпляра.

Ещё вопросы

Сообщество Overcoder
Наверх
Меню