jquery 类，打开两个相同答案

【问题标题】：jquery class, opens both of samejquery 类，打开两个相同
【发布时间】：2011-10-10 01:26:27
【问题描述】：

好的，所以我们有一个 mySQL while 循环回显特定结果的 div。

这是我们的代码：

<div class="post">
<p>hello World</p>
  <div class="contentSlide">
    <p>Members image on left and comments on the right. Date floated on right, and link to user.</p>
    <br />
    <div class="contact">
        <h3>Post a comment below</h3>
        <p>My <label class="agentsHcard">Listings</label> <small>Only displays for logged in</small></p>

       <form>
            <input type="text" READONLY></input><br />
            <textarea id="testTextarea" class="" type="text" name="comment" rows="3" style="background: none repeat scroll 0% 0% rgb(255, 255, 255); border: 1px solid rgb(51, 153, 255);"></textarea><br />
            <div style="float:right;margin-right:40px;">
                <button id="buttonsend" class="medium pink button" value="submit" name="submit" type="submit">Add Comment</button>
            </div>
       </form>
       <br />
    </div>
</div>
<div id="button" class="open">Comments(6) &#x25bc;</div>
</div>

基本上每个结果在我们的数据库中都有一个唯一的 ID，例如：1、2、3、4、5

$(document).ready(function(){
  reply=false;
$(".close").live('click',function(){
    if(reply!==true){
    $(".contentSlide, #contact").slideUp();
    $(this).html("Comments(6) \u25bc").removeClass("close").addClass("open");
    }
});
$(".open").live('click',function(){
    $(".contentSlide").slideDown();
    $(this).html("Close \u25b2 <span style='float:right;' onclick='reply=true;'  class='reply' >Post a <a href='javascript:void(0);'>comment</a></span>").removeClass("open").addClass("close");
});
$(".reply").live('click',function(e){

    $("#contact").slideDown(function(){reply=false;});
    $("#button").html("Post and Close \u25b2").removeClass("open").addClass("close");
});
})

我们正在寻找一种方法来做到这一点，以便为每个 div 分配一个唯一的 ID，该 ID 被传递给 javascript 并打开相关的 div。

就目前而言，如果我们有 2 个这样的结果，那么当单击打开的类时它们都会打开（显然）。

我们知道如何通过复制 JS 并为每个 JS 分配一个特殊的 ID 来做到这一点，但我们正在寻找一种更简洁的方法，即只使用 JS 一次并使其全局化。

我们怎样才能使它只有一个 javascript，并且它运行一个 ID？例如：

<div class="contentSlide" id="4">

谢谢。

【问题讨论】：

标签： php javascript jquery mysql

【解决方案1】：

如果你想要一个单一的 Javascript，那么 id 可能不是要走的路。为了对与被点击元素相关的 DOM 元素进行操作，您可能需要使用最接近（选择器）等相对遍历函数向上导航到当前目标的“.post”div，然后向下遍历到要操作的元素：

$(".close").live('click',function(){
    if(reply!==true){
    $(this).closest(".post").children(".contentSlide, #contact").slideUp();
    $(this).html("Comments(6) \u25bc").removeClass("close").addClass("open");
    }
});

如果您确实使用了基于 ID 的机制，您可能需要进行一些字符串操作，并让元素 id 成为带有前缀/后缀的原始 id（即 button_4、contact_4 等）

【讨论】：

【解决方案2】：

你可以试试

$('.openthis').click(function(){
  $(this).slideToggle();
});

在半无关的笔记中，ID 必须以字母开头。

【讨论】：

【解决方案3】：

创建一个函数，该函数接受一个 JQuery 项作为其参数并将相关操作绑定到它。然后使用选择器查找与该类匹配的所有项目，并将each 与该函数一起使用。

【讨论】：