jQuery: щелчок по поиску

ProgramBox

jQuery: щелчок по поиску

Post author:admin
Запись опубликована:26 марта, 2023
Post category:Вопросы по программированию

#jquery

Вопрос:

У меня есть ul

     <div id="menu">
  <ul>
    <li><a href="http://apple.com">first</a></li>
    <li><a href="http://apple.com">second</a></li>
    <li><a href="http://www.apple.com/iphone/">third</a>
      <ul>
        <li><a href="http://apple.com">third1</a></li>
        <li><a href="http://apple.com">third2</a></li>
        <li><a href="http://apple.com">third3</a></li>
        <li><a href="http://apple.com">third4</a></li>
      </ul>
    </li><!--fi altres -->
    <li><a href="http://apple.com">forth</a></li>
    <li><a href="http://www.apple.com/iphone/">fith</a>
       <ul>
        <li><a href="http://apple.com">fith1</a></li>
        <li><a href="http://apple.com">fith2</a></li>
        <li><a href="http://apple.com">fifh3</a></li>
      </ul>
    </li><!--fi nosaltres -->
  </ul>
</div><!--menu -->

У меня есть jQuery, который отлично работает при наведении курсора мыши:

 $(function(){
    $('#menu ul li').hover(function(){
            $(this).find('ul').fadeIn()
        },function() {
            $(this).find('ul').fadeOut()
        }
    )
})

То же самое не работает с click:

 $(function(){
    $("#menu ul li").click(function(event) {
        event.preventDefault();
        $(this).find('ul').fadeIn()
    });
})

Когда я нажимаю, чтобы исчезнуть в одном подменю, я должен исчезнуть перед другими подменю. Как?

1. Вы дважды процитировали один и тот же код в разделе «У меня есть jQuery, который отлично работает при наведении:» и (с другим отступом) в разделе «То же самое не работает с click:» .

2. Это работает здесь jsfiddle.net/cpn6h/1

3. это не завершено, и вы дважды процитировали один и тот же код «оба являются событиями щелчка», пожалуйста, проверьте свой вопрос еще раз

4. пожалуйста, обратите внимание, что mootools — это выбранная библиотека в вашем jsfiddle, А не jquery

5. Это отлично работает, когда вы выбираете jQuery в качестве библиотеки в jsFiddle.

Ответ №1:

я предполагаю, что вы хотите что-то вроде этого.

 $("#menu ul li").hover(function(event) {
        $(this).find("ul").fadeIn("slow");
    },
    function(event) {
        $(this).find("ul").fadeOut("slow");
});

РЕДАКТИРОВАТЬ Я думаю, что понял:

 $(document).ready(function () {
    $("#menu > ul > li").click(function(event) {
        var $this = $(this);
        if ( $this.find("ul").length amp;amp; event.target.href/*.split('/').pop()*/ == $('> a', this).attr('href') ) {
            event.preventDefault();
            $this.siblings().find("ul").fadeOut("slow");
            $this.find("ul").fadeIn("slow");
        }
    });
});

« amp;amp; event.target.href.split('/').pop() == $('> a', this).attr('href') » — это чтобы избежать отключения функциональности по умолчанию (откройте ссылку) в подменю.

ПРИМЕЧАНИЕ, если вспомогательная ссылка точно такая же, как ссылка memu, вспомогательная ссылка не будет работать. Вы можете заменить «http:://aaa.com /» по»http://www.aaa.com /» в меню ИЛИ подменю (но не в обоих)

1. Извините, я не очень хорошо объяснил. У меня нет проблем с наведением. Вопрос в том, как ЩЕЛКНУТЬ и получить подменю

2. я думаю, я понимаю, чего вы хотите. проверьте мой отредактированный ответ и эту скрипку . когда вы нажимаете меню с подменю, оно скрывает другие подменю, если они отображаются, и отображает подменю. Если щелкнуть меню БЕЗ подменю, откроется ссылка.

3. Спасибо за ваш ответ. Ваша скрипка работает нормально. Я понимаю, и я думаю, что это здорово, что вы скрываете другие подменю. Но у меня проблемы с меню без подменю и их ссылками: 1- Это работает в скрипте, но когда я копирую-вставляю в файл, это не так: mig-marketing.com/proves2/2-forum.html Я делал так много раз, и я не нахожу проблему.

4. поскольку ваш скрипт находится в заголовке страницы, он пытается привязать событие щелчка к несуществующему элементу, поскольку #menu создается позже в теле страницы. Попробуйте добавить $(document).ready(function() { *_CODE_HERE_* }); вокруг кода. редактировать: ну что ж, добавил это в мой ответ;)

5. Вы правы. Извините, моя ошибка была глупой. Как вы можете видеть, я только учусь. Теперь он отлично работает на компьютерах, iPad, но не работает на iPhone. Почему?

Ответ №2:

Вы не указали, что хотите использовать jQuery. Поскольку $ не был подключен к jQuery, он вернул значение null. В разделе Выбор фреймворка выберите версию jQuery для загрузки, и ваш код заработает.

Возможно, вы захотите изучить, что roselan предложил для улучшения функциональности, однако.