Question

我想在点击时显示搜索和购物车窗口小部件，而不是将鼠标悬停在此处https://joomlance.com/

我使用了以下Javascript代码：

jQuery(document).ready(function() {
    jQuery('body').click(function(e) {
        var container = jQuery(".woodmart-search-dropdown");

        // if the target of the click isn't the container nor a descendant of the container
        if (!container.is(e.target) && container.has(e.target).length === 0) 
        {
            console.log("as Menu");
            container.hide();
        } 
    });

    jQuery('.search-button').click(function(e) {
        jQuery('div.woodmart-search-dropdown').toggle();
        console.log("Opened Menu");
        e.stopPropagation();
    });
});

但这不能很好地工作，在尝试写任何东西时它也会隐藏搜索窗口小部件，在单击“删除产品”图标时它会隐藏卡窗口小部件，而我在粘性标题上不起作用

请问我该怎么做？

Answer 1

如果我正确理解，则不需要此代码：

jQuery('body').click(function(e){ ....

至少在每次单击主体后（以及当您专注于搜索输入时）它都是隐藏容器。

只需尝试使用此

：

$(function(){

  var container = $('.woodmart-search-dropdown');


  $('.search-button').on('click', function(e) {
      container.toggle();
  });

});

Answer 2

//To hide:
elem.style.display=“none”;

//To show:
elem.style.display=“inline”;

elem表示要使用的元素。我不确定是否可行，请告诉我是否可行。

使用jQuery下拉隐藏显示

2 个答案: