PHP-jQuery类,打开相同的两个

好的,我们有一个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.

就目前而言,如果我们有其中两个结果,则当单击打开类时(显然),两个结果都将打开.

我们知道如何通过复制JS并为每个ID赋予一个特殊的ID来做到这一点,但是我们正在寻找一种更清洁的方法,即仅使用JS一次并将其全局化.

我们如何做到这一点,使我们只有一个javascript,并且运行在ID之外?例如:

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

谢谢.

最佳答案
如果您只需要一段Javascript,那么id可能不是您的理想选择.为了对与clicked元素相关的DOM元素进行操作,您可能希望使用相对遍历函数(例如,closest(selector))导航到当前目标的“ .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为带有前缀/后缀(即button_4,contact_4等)的原始ID.

转载注明原文:PHP-jQuery类,打开相同的两个 - 代码日志