Question

我在div中有一个复选框。当用户点击div（复选框除外）时，另一个div显示并隐藏。这是通过JQuery实现的。但我的问题是，当我点击复选框时div也显示滑动效果（我不想要）。单击复选框时如何防止div滑动。

Answer 1

使用复选框上的.stopPropagation()方法。如果您的复选框的ID为thecheckbox，请使用

$("#thecheckbox").click(function(event){
  event.stopPropagation();
});

Answer 2

经过一天的努力终于得到了解决方案。我只是在JQuery中为事件添加一个参数。然后检查事件源是否为“CheckBox”类型，然后不要折叠div，否则折叠div。我的代码如下：

    $(document).ready(function()
    {
       //The event handler for the click event of the div.
        $('.divClientList').click(function(e)
        {
            //Check if the event source is other then checkbox,
            //then collapse the div, else do nothing.
            if (e.target.type != "checkbox")
            {
                //If the target div content is empty then do nothing.                    
                if ($('.divContent').is(':empty'))
                {
                }
                else
                {
                    $('.divContent').slideToggle('slow');
                }
            }

        });
    });

当我们单击div中的复选框时，如何防止div崩溃？

2 个答案: