Javascript 双击JQuery

有点麻烦。所以我的公司想要一个左抽屉的应用程序菜单。具体来说，菜单控件也附加在每一行上。i、 e.每行都有单独的订单编号和附加的操作按钮。单击“操作”按钮时，抽屉将打开以执行各种操作。现在的问题是，第一次而且只有第一次点击需要两次点击。一次点击可以在页面上的任何位置。需要第二次单击以激活抽屉。第二次单击后，它关闭，并通过一次单击平滑地重新打开。那么为什么前两次点击

以下是Jquery：

$(document).ready(function() {
    $(document).on('click', function(event){    
        $('.slideout-menu-toggle').on('click', function(event){
            $('.slideout-menu-toggle').unbind();
            event.preventDefault();
            // create menu variables
            var slideoutMenu = $('body');
            var slideoutMenuWidth = $('.slideout-menu').width();

            // toggle open class
            slideoutMenu.toggleClass("open");

            // slide menu
            if (slideoutMenu.hasClass("open")) {
                slideoutMenu.animate({
                    left: "0px"
                }); 
            } else {
                slideoutMenu.animate({
                    left: -slideoutMenuWidth
                }, 278);

            }
        });
    }); 
});

---

需要进行第一次单击才能使

。滑动菜单切换

接收其绑定

...
$(document).on('click', function(event){    // first click
    $('.slideout-menu-toggle').on('click', function(event){ // menu click added
...

---

需要进行第一次单击才能使

。滑动菜单切换

接收其绑定

...
$(document).on('click', function(event){    // first click
    $('.slideout-menu-toggle').on('click', function(event){ // menu click added
...

---

尝试在首次单击功能中

返回false

$(document).on('click', function(event){        
    $('.slideout-menu-toggle').on('click', function(event){
     //code here
    })
    return false;
})

---

尝试在首次单击功能中

返回false

$(document).on('click', function(event){        
    $('.slideout-menu-toggle').on('click', function(event){
     //code here
    })
    return false;
})

---

您正在另一个单击事件处理程序中绑定一个单击事件处理程序。第一次单击绑定处理程序，第二次单击触发它。您正在另一个单击事件处理程序中绑定一个单击事件处理程序。第一次单击绑定处理程序，第二次单击触发它。