0

我是 jQuery 的新手。

我有一个如下的 html 代码，它是动态生成并添加到我的页面中的：


<div class="outstandingcallback">
<span>a</span>
<span>b</span>
</div>
<div class="outstandingcallback">
<span>c</span>
<span>d</span>
</div>
    ......

当我单击另一个时，我需要隐藏其中一个。我使用了以下 jQuery，但我不确定如何隐藏 div 元素。


    $('.outstandingcallback').bind('click', function () {
                var selectdCallItemID = $(".callItemID", this).html();


                var myHtmlCode = $('#CallBacks').html();

                $('' + myHtmlCode + '').find('div').each(function () {
                    var thisCallID = $(".callItemID", this).html();

                    if (thisCallID == selectdCallItemID ) {
                        alert("test");
                        $('' + myHtmlCode + '').find(this).hide();
                    }
                });
            });

我不确定以下部分：


    $('' + myHtmlCode + '').find(this).hide();
4

5 回答 5

1

您可以使用.siblings()查找同一级别的其他元素：

因为which is generated on the fly and added to my page使用.on并将事件委托给最近的现有父级或document

 $(document).on('click', '.outstandingcallback', function () {
    $(this).siblings('.outstandingcallback').hide();
 });
于 2013-04-01T09:36:14.610 回答
1

尝试这样的事情，小提琴

 $('.outstandingcallback').bind('click', function () {
     $('.outstandingcallback').hide(); 
     $(this).show(); 
});
于 2013-04-01T09:42:55.780 回答
0 
<script>
 function doAnimation()
 {
    $("#secondDiv").toggle(300);
 }
  </script>


 <div id='firstDiv' onclick='doAnimation()'></div>
 <div id='secondDiv' ></div>
于 2013-04-01T09:32:22.827 回答
0 
if($(".outstandingcallback:first").click()) {
    $(".outstandingcallback:first").show();
    $(".outstandingcallback:last").hide();
} else if ($(".outstandingcallback:last").click()) {
    $(".outstandingcallback:first").hide();
    $(".outstandingcallback:last").show();
}
于 2013-04-01T09:34:12.947 回答
0

简单地隐藏未点击的 div 你只需要这样：

 $(function(){
    $('.outstandingcallback').on('click', function () {
        $(this).siblings().hide();
    });
})
于 2013-04-01T09:56:12.660 回答