PHP foreach 函数不适用于我的 jquery 代码

Question

我已经写了这个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);
});

});

实现类似this!

然后我编写了以下 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 或其他语言？解决这个问题的最优雅的方法是什么？

Answer 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);
});