Question

我有一个需要帮助的jQuery问题。

在我的WordPress网站上，我正在使用jQuery脚本进行搜索栏。目前有一个按钮，点击它会显示一个搜索栏。我希望默认情况下（始终）可以看到该搜索栏。所以我不必点击按钮，而是让我的搜索栏始终可见。

这是html代码：

<div class="top-search-form">
  <div class="gdl-search-button" id="gdl-search-button"></div> 
  <div class="search-wrapper">
    <div class="gdl-search-form">
      <form method="get" id="searchform" action="<?php  echo home_url(); ?>/">
        <?php
          $search_val = get_search_query();
          if( empty($search_val) ){
            $search_val = __("Pretraga.." , "gdl_front_end");
          }
        ?>  
        <div class="search-text">
          <input type="text" value="<?php echo $search_val; ?>" name="s" id="s" autocomplete="off" data-default="<?php echo $search_val; ?>" />
        </div>
        <input type="submit" id="searchsubmit" value="<?php _e("Kreni", "gdl_front_end") ?>" />
        <div class="clear"></div>
    </form>
</div>

这是jQuery函数：

var search_button = jQuery("#gdl-search-button");
search_button.click(function(){
  if(jQuery(this).hasClass('active')){
    jQuery(this).removeClass('active');
    jQuery(this).siblings('.search-wrapper').slideUp(200);
  }else{
    jQuery(this).addClass('active');
    jQuery(this).siblings('.search-wrapper').slideDown(200);
  }
    return false;
});
jQuery("#gdl-search-button, .search-wrapper").click(function(e){
  if (e.stopPropagation){ e.stopPropagation(); }
  else if(window.event){ window.event.cancelBubble = true; }
}); 
jQuery("html").click(function(){
  search_button.removeClass('active');
  search_button.siblings('.search-wrapper').slideUp(200);           
});

Answer 1

删除CSS中的相关.click事件和display: block主搜索栏容器。 （这应该足以让你到那里）

1。）删除与搜索栏 show 相关的jQuery。（例如。click事件（ s ））。

2。）更改.css文件，其中搜索元素为display:none;或display:hidden;如果点击事件显示，则很可能是display:none; <%-- 1}}在css 中（更多代码因此而有用）。您可以通过在开始--%>处结束此事件display:block;

来注释掉点击事件以进行测试

3。）在步骤2之后确保相关的css现在是'table.imageList > tbody > tr > td > a[href^="build/artifacts/"]'。）（但如果你删除没有;默认情况下它应该显示）

如果这不起作用，则显示完整代码或使用jSfiddle等在线IDE创建在线演示。 ;）

jQuery单击事件搜索栏

1 个答案: