Question

我需要绑定和取消绑定以下内容，具体取决于单击的按钮。这是先发生的事情：

<script type="text/javascript">
$(document).ready(function() {
    $('.xxMenu > li').bind('mouseover', openSubMenu);
[... etc.]
</script>

这使得一些下拉菜单功能。在下一个脚本中，如果我放入以下任一项，它们可以正常解除上述操作，从而在单击搜索按钮时禁用菜单：

 $('.xxMenu > li').unbind('mouseover');
 $('.xxMenu > li').unbind();

顺便说一句，我注意到这种情况不起作用：

 $('.xxMenu > li').unbind('mouseover', openSubMenu);

现在，在之后的脚本中，如果我放下以下任何一个，他们就不会恢复，即重新绑定第一个（当有人点击按钮取消搜索时）。这是这种情况下的整个脚本：

  <script type="text/javascript">
    $(document).ready(function() {
     $('.closeSearch > img').bind('click', closeSearchBar);

    function closeSearchBar() {
        $('form.xxx').css('visibility', 'hidden');  
        $('.closeSearch > img').css('visibility', 'hidden');
        $('.searchIcon > img').css('visibility', 'visible');

          /* the ones that aren't working */
          $('.xxMenu > li').bind();
          /* or */
          $('.xxMenu > li').bind('mouseover');
          /* or */
          $('.xxMenu > li').bind('mouseover', openSubMenu);        
       };          
     });
   </script>

我想知道语法或逻辑在哪里出错了，看at this但是无法弄明白。

更新：以下是整个要求。对不起，我以为我只是通过发布重要部分来节省每个人的时间。相当新的。

<!-- 
Activate Drop Down Menus 
-->

<script type="text/javascript">
    $(document).ready(function() {
    $('.xxMenu > li').on('mouseover', openSubMenu);
    $('.xxMenu > li').on('mouseout', closeSubMenu);

    function openSubMenu() {
        $(this).find('ul').css('visibility', 'visible');    
    };

    function closeSubMenu() {
        $(this).find('ul').css('visibility', 'hidden'); 
    };

});
</script>


<!-- 
Open search field
-->

<script type="text/javascript">
$(document).ready(function() {
    $('.searchIcon > img').on('click', showSearch);

    function showSearch() {
        $('.search-macro .search-macro-query input').css('width', '533px');
        $('form.aui').css('visibility', 'visible'); 
        $('form.aui').css('z-index', '15');
        $('.closeSearch > img').css('visibility', 'visible');
        $('.search-macro-button').css('visibility', 'hidden');
        $('.searchIcon > img').css('visibility', 'hidden'); 

          /* disable the drop-down menus */
          $('.xxMenu > li').off('mouseover');

    };                         
});
</script>


<!-- 
Close search field when X button is clicked
-->

<script type="text/javascript">
$(document).ready(function() {
    $('.closeSearch > img').on('click', closeSearchBar);

    function closeSearchBar() {
        $('form.aui').css('visibility', 'hidden');  
        $('.closeSearch > img').css('visibility', 'hidden');
        $('.searchIcon > img').css('visibility', 'visible');
                    /* re-enable the drop-down menus if search is canceled */
        $('.xxMenu > li').on('mouseover', openSubMenu);
    };         
});
</script>


 <!-- 
 Show live search button when any search input typed in the field
 -->

 <script type="text/javascript">
 $(document).ready(function() {
 $('form.aui').on('keypress', changeImgs);

  function changeImgs() {
  $('.closeSearch > img').css('visibility', 'hidden');

  $('.aui-button').css({'z-index':'12', 'visibility':'visible', 'position':'relative', 'left':'292px', 'border':'0px','border-radius':'0px', 'background':'url(http://ops.confluence.uat.apg.services.gs.com:18090/download/attachments/38109760/searchPrompt.gif?version=5&modificationDate=1413553110523&api=v2) no-repeat'});

  $('input.text').css({'border':'0px'});

  /*   Hide the gray Confluence search submit button   */
  $('.searchbar > div > form > fieldset > button > span').css({'visibility':'hidden'})


 };
});

Answer 1

评论中的这个答案修正了它：

“只是在就绪处理程序范围之外声明函数”

只是作为一个答案，以防它对别人有用。我知道的一个基本问题，但仍然存在。

jquery .unbind和.bind无法正常工作

1 个答案: