скрыть элемент при нажатии на любую страницу и показать его нажатием на другой элемент

У меня есть текст ввода, который я использовал для быстрого поиска, под этим вводом есть div, который я использую, чтобы показать результат поиска. набрав вход, результат появится в div.now, я хочу скрыть этот элемент (значение div) всякий раз, когда я нажимаю на окно и снова показываю его, нажимая на input.I пробовал несколько jquery-кода, чтобы скрыть элемент, но я не смог показать его снова.скрыть элемент при нажатии на любую страницу и показать его нажатием на другой элемент

$(window).click(function() { 
    $('#livesearch').hide(); 
}); 
$('#search').click(function() { 
    $('#livesearch').show(); 
});

источник

2012-02-19 kamal

Показать весь код + HTML. Код, который вы вставили, действителен. – gdoron

Вы пробовали положить 'e.stopPropagation' в обработчик кликов' # search'? Я не знаю, сработает ли это, но может. – Bojangles

Я понятия не имею, как использовать e.stopPropagation – kamal

Вы должны использовать триггер blur() и focus() событий в JQuery. doc

$('#input_window').blur(function() { 
    $('#livesearch').hide(); 
}).focus(function() { 
    $('#livesearch').show(); 
});

Измените #input_window на то, что в вашем HTML коде.

источник

2012-02-19 13:15:42 steveyang

теперь, когда я нажимаю на результат поиска, элемент div 'скрыть сначала (результат поиска - ссылки на другую страницу) – kamal

Это предполагаемое поведение' blur() 'при нажатии ссылки на результат, вы ** размыли ** от своего окна ввода. Я предполагаю, что вы хотите только размыть, когда пользователь потеряет фокус как на поле ввода, так и на результатах поиска. Я предлагаю поместить эти два элемента в один div и связать событие 'blur()' с этим div. – steveyang

Я положил их в один div, но я не знаю, как использовать bind. (Мои знания о jquery очень низки) – kamal

Я не уверен, что для объекта "window" существует событие click. Но я не эксперт в JS по этому поводу.

Пожалуйста, проверьте этот код, я думаю, что он делает то, что вы хотите достичь по-другому.

Редактировать: Проверьте этот код. Это предотвращает скрытие результатов поиска, если вы нажмете их. Поскольку я уже изучаю JQuery, я нашел время, чтобы поэкспериментировать с этим, достижение этой функциональности кажется более сложным, чем это должно быть :)

<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<title></title> 
<script src="jquery-1.7.1.min.js" type="text/javascript"></script> 
<script type="text/javascript"> 
    $(function() { 
     $(':not(.search_result)').focus(function() { 
      $('#livesearch').hide(); 
     }); 
     $('#search').focus(function() { 
      $('#livesearch').show(); 
     }); 
    }); 
</script> 
</head> 
<body> 
<div> 
    <input id='search' type="text" /> 
    <div id='livesearch' style='display: none'> 
     <ul> 
      <li><a class='search_result' href='#'>result#1</a></li> 
      <li><a class='search_result' href='#'>result#2</a></li> 
     </ul> 
    </div> 
</div> 
<div> 
    The rest of the page. 
</div> 
</body> 
</html>

источник

2012-02-19 13:28:21 wassim

Я пробовал этот код, он имеет ту же проблему, что и @ steven.yang код – kamal

Это не работало для меня. результат поиска появляется, но они больше не собираются скрываться. Я также меняю первый фокус на размытие, и еще раз не работал! – kamal

Да ... он работает с IE9.0, если вы разрешаете ему запускать скрипты. Не работал с FF или Chrome :( – wassim

скрыть элемент при нажатии на любую страницу и показать его нажатием на другой элемент

ответ

Смежные вопросы