Javascript-форум (https://javascript.ru/forum/)
-   Events/DOM/Window (https://javascript.ru/forum/events/)
-   -   Проблема с .blur в jQuery (https://javascript.ru/forum/events/29698-problema-s-blur-v-jquery.html)

Akademik 07.07.2012 20:35

Проблема с .blur в jQuery
 
Доброго вечера,

Желающим потестить -- данные для авторизации

Имеем на вход: страничку, в которой нужно закрыть модальное окошко (menu->reup, .wprp_form) по внешнему клику; jQuery.

Присваиваем через файрбагову консоль функцию для события blur к нашему окошку:
$('.wprp_form').blur(
function(){
alert ('op');
}
);


Срабатывает при $('.wprp_form').blur, но не при клике мимо окошка. В чем проблема?

vadim5june 07.07.2012 20:52

вы blur на div повесили а он не поддерживает это событие

Deff 07.07.2012 21:17

<script type="text/javascript" src="http://yandex.st/jquery/1.4.4/jquery.min.js"></script>
<div style="height:100px"></div>

<div class="wprp_form" id="wprpform2186">
<b>Request Reupload</b>
    <form action="" method="post" enctype="text/plain" onsubmit="return wprp_report(this);">
Why:&nbsp;&nbsp; <select name="report_as" id="report_as">
<option value="Dead Links">Dead Links</option>

</select>

<textarea name="description" style="margin:5px 10px; width: 280px;">Optional Comment</textarea>

	<input type="hidden" value="2186" name="post">
	   <input type="hidden" name="_wpnonce" value="a42a3be875" />
	<input name="do_report" type="submit" value="Submit Report" class="wprp_submit">

    </form>
</div>


<script>
$(document).ready(function(){
var Flag=false;
   function TstBlur (){
        if(!Flag) alert ('op');
  }
   $('.wprp_form form *').focus(function () {
         Flag=true;
    });

    $('.wprp_form form *').blur( function(){
      Flag=false; setTimeout(function(){TstBlur()},10)

    });
});
</script>

Клик по любому не элементу заполнения или кнопке - вызовет алерт

cyber 07.07.2012 22:16

а как насчет tabindex (тоже вариант)

Akademik 08.07.2012 11:14

Спасибо за советы, суть понял, написал своё решение:

var a = $("#article_edit_links_active a");
var b = $("#article_edit_links_active").children();
var c = $.merge(a, b);
// изначально вместо такого разврата использовал просто $("#article_edit_links_active"), в файрбаге также работало


$(document).children().click(function() {
  $(".wprp_form").css("display", "none");
  console.log ('frfr');
});

$(c).click(function(event){
  event.stopImmediatePropagation();
});


Но вот беда -- при исполнении из файрбага все работает отлично, при записи в head (в самый низ, дабы избежать конфликтов) -- лог в консоль выводить также при клике по кнопке reup, и чтобы открыть модальное окошко приходится делать двойной клик по ссылке. Как с проблемой совладать?

P.S. А по tabindex -- где о нем почитать? Ибо изо всех источников нашел только одну хорошую, но битую гуглокнигу


Часовой пояс GMT +3, время: 20:35.