javascript - 我在jPushMenu中添加了一个“输入”，但是如果我在输入上“单击”，菜单将关闭。我可以防止这种行为吗？

我正在尝试在jPushMenu中添加搜索表单
但是每次我单击输入文本时，菜单都会关闭（可能是由于“ closeOnClickOutside”参数

我正在尝试编写这样的函数：

            $('.cbp-spmenu input').on('click',function() {
                // dont execute jPushMenu.close(o);
            });

但我真的不知道该怎么做



这是jPushMenu.js

/*!
 * jPushMenu.js
 * 1.1.1
 * @author: takien
 * http://takien.com
 * Original version (pure JS) is created by Mary Lou http://tympanus.net/
 */

(function($) {
    $.fn.jPushMenu = function(customOptions) {
        var o = $.extend({}, $.fn.jPushMenu.defaultOptions, customOptions);

        $('body').addClass(o.pushBodyClass);

        // Add class to toggler
        $(this).addClass('jPushMenuBtn');

        $(this).click(function(e) {
            e.stopPropagation();

            var target     = '',
            push_direction = '';

            // Determine menu and push direction
            if ($(this).is('.' + o.showLeftClass)) {
                target         = '.cbp-spmenu-left';
                push_direction = 'toright';
            }
            else if ($(this).is('.' + o.showRightClass)) {
                target         = '.cbp-spmenu-right';
                push_direction = 'toleft';
            }
            else if ($(this).is('.' + o.showTopClass)) {
                target = '.cbp-spmenu-top';
            }
            else if ($(this).is('.' + o.showBottomClass)) {
                target = '.cbp-spmenu-bottom';
            }

            if (target == '') {
                return;
            }

            $(this).toggleClass(o.activeClass);
            $(target).toggleClass(o.menuOpenClass);

            if ($(this).is('.' + o.pushBodyClass) && push_direction != '') {
                $('body').toggleClass(o.pushBodyClass + '-' + push_direction);
            }

            // Disable all other buttons
            $('.jPushMenuBtn').not($(this)).toggleClass('disabled');

            return;
        });


        var jPushMenu = {
            close: function (o) {
                $('.jPushMenuBtn,body,.cbp-spmenu')
                    .removeClass('disabled ' + o.activeClass + ' ' + o.menuOpenClass + ' ' + o.pushBodyClass + '-toleft ' + o.pushBodyClass + '-toright');

        }

        // Close menu on clicking outside menu
        if (o.closeOnClickOutside) {
             $(document).click(function() {
                jPushMenu.close(o);
             });
         }

        // Close menu on clicking menu link
        if (o.closeOnClickLink) {
            $('.cbp-spmenu a').on('click',function() {
                if ( $(this).hasClass('preventclick') ) return;
                jPushMenu.close(o);
            });
        }

        // Close menu on clicking menu link
        if (o.closeOnFocus) {
            $('.logo_wrapper a').on('focus',function() {
                jPushMenu.close(o);
            });
        }

    };

   /*
    * In case you want to customize class name,
    * do not directly edit here, use function parameter when call jPushMenu.
    */
    $.fn.jPushMenu.defaultOptions = {
        pushBodyClass      : 'push-body',
        showLeftClass      : 'menu-left',
        showRightClass     : 'menu-right',
        showTopClass       : 'menu-top',
        showBottomClass    : 'menu-bottom',
        activeClass        : 'menu-active',
        menuOpenClass      : 'menu-open',
        closeOnClickOutside: true,
        closeOnClickLink   : true,
        closeOnFocus       : true
    };
})(jQuery);

最佳答案

这是由文件$(document).click()（here）中第66行上的jPushMenu.js引起的。您可以通过修改本地文件来解决此问题，如下所示：

// Close menu on clicking outside menu
if (o.closeOnClickOutside) {
  $(document).click(function(e) {
    if (!$(e.target).closest('.cbp-spmenu').length && $('.cbp-spmenu').is('.' + o.menuOpenClass)) {
      jPushMenu.close(o)
    }
  });
}

然后使用closeOnClickLink初始化菜单：

$('#menu').jPushMenu({
  closeOnClickLink: false
})

我可能为此发送拉请求:)