php - jQuery 单击一个 DIV 并隐藏所有其他 DIV 检测

Question

我的网站上有一个票务系统。有几个 div 显示原始票证，然后嵌套在这些 div 之间的子隐藏 div 显示客户和员工的交互。我想打开一个 div，然后关闭其他 div，然后如果他们打开另一个 div，则此 div 和所有其他 div 都会关闭，显示他们单击打开的那个 div。

jQuery(document).ready(function () {
    // ****** Click the ticket DIV
    $(".ticket_thread_7").click(function () {

        // Slide the SUB DIVs associated with this ticket
        $(".ticket_threads_7").slideDown("slow");

        // Turn the arrow from DOWN.png to UP.png
        $('.ticket_arrow_7').attr("src", "http://cdn.com/assets/imgs/up.png");

    // ****** If they have click the arrow again    
    }, function () {

        // .. close this ticket
        $(".ticket_threads_7").slideDown("slow");

        // .. also return the image back to normal
        $('.ticket_arrow_7').attr("src", "http://cdn.com/assets/imgs/up.png");

        return false;
    });
});

HTML

<div class="ticket_thread_7">
    <p>I want to return my order <img src="http://cdn.com/assets/imgs/up.png" class="ticket_arrow_7"></p>
    <div class="ticket_threads_7" style="display:none">

        <div class="staff_7_1"><p>We cannot accept a return on this item.</p></div>
        <div class="cus_7_2"><p>Why not.</p></div>
        <div class="staff_7_3"><p>Please visit cdn.com/returnterms to see our policy, apologies.</p></div>

    </div>
</div>

当前的解决方案运行良好。正如你可以想象的那样。这是一个动态 PHP 驱动的网站，因此我们在该网站上有很多门票。我想知道在 jQuery 中我可以使用命令来获取页面上的所有其他 DIV 元素 Id 并隐藏它们。

那么我可以做这样的事情吗:

// Hide all other current open threads and reset their arrows
$(".ticket_threads_7*!=7").slideDown("slow");
$('.ticket_arrow_'*!=7).attr("src", "http://cdn.com/assets/imgs/up.png");

因此，当他们单击箭头时，所有其他线程如果打开，则将关闭，并且箭头将重置，并且此线程将打开。

Answer 1

类并不是为了指向独特的东西而设计的，你应该这样做:

<div class="ticket_thread" id="ticket_thread_7">
   <p>...<img class="arrow" /></p>
   <div class="details">
      ...
   </div>
</div>

然后，就很容易做你想做的事了:

$(".ticket_thread").not(this).find('.details').slideDown("slow");
$(".ticket_thread").not(this).find('.arrow').attr("src", "http://cdn.com/assets/imgs/up.png");

此外，请考虑使用类和 CSS sprites设计箭头。