| |
 18.9 Кб |
|
| | Здравствуйте! Нужно закрыть всплывающее окно, если было нажатие левой кнопкой мыши вне этого окна.
Написал так:
$(function () {
$('body').mousedown(function(e) {
var param = 1;
if(e.which == 1) {
$('.content').mousedown(function(e) { if(e.which == 1) {param = 0;} });
/* здесь param всегда со значением 1, даже когда нажимаешь на элемент .content */
if(param) { $('content').hide(); }
}
});
)};
|
Можете объяснить как сделать так, чтобы param менялся как глобальная переменная, а не только внутри функции? Прикрепил скриншот | |
| |
|
|
| |
|
|
| |
для: ladan
(02.05.2013 в 10:47)
| | | | |
| |
|
|
| |
|
|
| |
для: яса1
(02.05.2013 в 13:29)
| | | не помогло
$(function () {
$('body').mousedown(function(e) {
param = 1;
$('.content').mousedown(function(e) { param = 0; alert(param); }); //Тут 0
alert(param);
// Здесь всегда 1, но нужно чтобы тоже был 0, если в строчке
// выше я присваиваю 0. Получается, что из строчки выше
// param доступен только в той функции
});
});
|
| |
| |
|
|
| |
|
|
| |
для: ladan
(02.05.2013 в 13:44)
| | | тарабарского (jquery) не знаю
потому объясню "на пальцах" работу системы закрытия тултипа по клику вне его:
-- в момент всплывания тултипа объекту document.body по событию onmousedown
назначается некая поименованная функция (методом addEventListener () или
attachEvent () для ранних версий MSIE)
-- эта функция определяет объект, по которому кликнули
-- и сразу проверяет - является ли этот объект тултипом
-- если НЕ является, функция начинает перебирать родителей этого объекта и каждого
из них спрашивает - не тултип ли он или не <body>?
-- если очередной объект отвечает "тултип", то происходит выход из функции без каких либо действий
-- если же отвечает <body>, то тултип закрывается и одновременно эта самая поименованная функция
с тела документа "снимается" (методом removeEventListener () или detachEvent () для
ранних версий MSIE) | |
| |
|
|
| |
852 байт |
|
| |
для: яса1
(02.05.2013 в 14:05)
| | | Вот архив:
P.S. Вполне можно обойтись без глобальной переменной.
P.P.S. "Закрывающий" клик целесообразнее назначать не "body", a "document". | |
| |
|
|
| |
|
|
| |
для: Deed
(02.05.2013 в 18:05)
| | | Вообще-то вы используете глобальную переменную, утверждая, что можно обойтись без нее.
<script>
function setVar() {
my = 1; //это установка ГЛОБАЛЬНОЙ переменной
}
</script>
<button onclick="setVar()">SET VAR</button>
<button onclick="alert(my)">GET VAR</button>
|
А обойтись без переменных (любых) можно в данном случае, достаточно передать телу список тех объектов, которые должны быть скрыты при при щелчке на нем. | |
| |
|
|
| |
|
|
| |
для: confirm
(02.05.2013 в 18:28)
| | | Так я и использовал эту param потому, что она была в вопросе.
Можно вполне обойтись без нее, достаточно проверки условия, что клик был сделан вне "диалога" с id="content":
$(e.target.id)!='content'
|
| |
| |
|
|
| |
|
|
| |
для: Deed
(02.05.2013 в 18:35)
| | | А к чему тогда вы архив прицепили? Утверждаете одно, приводите другое, да еще прицепом.
Проверка источника, это решение когда требуется скрывать один единственный объект, в противном случае это не удобно. Лучше использовать $.data() для body, в который записывать ссылку на объект, обработчик которого в данный момент обрабатывается.
Body вообще хорошее место "для свалки" ссылок, например для тех же глобальных событий, которые есть в jQuery. | |
| |
|
|
| |
|
|
| |
для: confirm
(02.05.2013 в 18:47)
| | | Архив я "прицепил" для наглядной демонстрации примера. Это раз. А, во-вторых, месье Laban эту переменную использует в своем примере, фрагмент которого он привел. Откуда мне знать, что там у него вообще в планах с этим param'oм?
Я заметил, что эта переменная для реализации скрытия 'content' не нужна вообще, как бы вскользь, мимоходом, небрежно так...
Не придирайтесь к мелочам, мэтр! | |
| |
|
|
| |
|
|
| |
для: Deed
(02.05.2013 в 18:54)
| | | Не Laban, а Ladan (отца перепутали), и не придираюсь, а просто не понял к чему это все, потому и написал так. ) | |
| |
|
|
| |
|
|
| |
для: ladan
(02.05.2013 в 13:44)
| | | Вы какой-то кошмар пишите, в обработчик события body прячете обработчик такого же события элемента. Вы понимаете, что за хрень в данном случае будет происходить? Писать надо либо раздельно, так:
$(function() {
$('body').mousedown(function(e) {
param = 1;
alert(param);
});
$('.content').mousedown(function(e) {
e.stopPropagation();
param = 0;
alert(param);
});
});
|
либо делегировать обработку. А если это глобальная переменная для всех, а изменением ее управляют эти два объекта, то нужно ее вынести:
var param;
$(function() {
$('body').mousedown(function(e) {
......
|
| |
| |
|
|
| |
|
|
| |
для: confirm
(02.05.2013 в 14:06)
| | | всем спасибо за ответы, пойду разбираться :)
stopPropagation() - не знал этого метода, так теперь все понятно как-такие вещи делать ) | |
| |
|
|
| |
|
|
| |
для: ladan
(02.05.2013 в 18:55)
| | |
$(function () {
$('body').click(function () {
$('div#fixed').fadeOut('fast');
});
$('div.content').click(function (event) {
event.stopPropagation();
});
});
|
да, тут без параметров все можно было сделать! Спасибо за советы и подсказки!! | |
| |
|
|
| |
|
|
| |
для: ladan
(02.05.2013 в 19:16)
| | | Можно, но только в случаях, о которых говорилось выше. Например, при делегировании событий элементами нужно скрыть родителя этих элементов, если источником события не является определенный элемент из этого набора элементов. В этом случае нужно проверять источник. Но если такое действие определено для ряда элементов из их набора, то проверка источника для каждого из набора, это уже плохо. В этом случае нужно иметь ссылки на такие определенные элементы (организовать удобное представление элементов в DOM иерархии всегда можно, а значит и иметь такой список ссылок удобный для обращения по нему).
Задача "исполнить действие, если вне источника" возникает часто. Ваша задача пустяковая, но зачастую такая задача может иметь массу условий. К примеру, страница с товарами, при этом каждый товар можно набирать двумя способами - щелчками по кнопкам +/- и прямым вводом в поле ввода. При любом из способов набора товара где-то рядом с этим "полем боя" должна отображаться информации о сумме набранного в данный момент товара (просчитывается на клиенте, и выводится клиентом). Добавление набранного товара в корзину производится по нажатию на кнопу "Добавить в корзину".
Есть условие - если набран товар и не добавлен в корзину, а происходит переход в поле ввода (поле ввода получает фокус) или щелчок по кнопкам +/-/ "Добавить в корзину" другого товара, то поле предыдущего товара, в котором происходил набор должно быть очищено, а также удалена информация о его набранной сумме.
Вроде бы ничего сверх сложного, но нужно учитывать - различные источники; различные по типу события. Вот в этом случае становится ясно, что необходимо хранить ссылку на текущий источник (поле ввода), проверяя его на событиях потери фокуса. А так как добавление товара по кнопке и непосредственным вводом в поле, это одни и те же задачи, то разные типы событий от поле ввода и кнопок +/-/"Добавить в корзину" нужно делегировать родителю, обрабатывая их одним обработчиком, одновременно выполняя действие "щелкнули вне меня". | |
| |
|
|
| |
|
|
| |
для: confirm
(02.05.2013 в 21:37)
| | | Спасибо, буду иметь ввиду! :) | |
| |
|
|
