Javascript-форум (https://javascript.ru/forum/)
-   jQuery (https://javascript.ru/forum/jquery/)
-   -   dialog( "close" ) не работает (https://javascript.ru/forum/jquery/14870-dialog-close-ne-rabotaet.html)

Sufir 04.02.2011 17:33

dialog( "close" ) не работает
 
Не срабатывает "close".

<div id="dialogBox" title="Заголовок диалогового окна.">
  <p>Текст диалогового окна.</p>
  <p><button class="dialogBoxBtn">Закрыть 2</button></p>
</div>
$(document).ready(function() {

$("#dialogBox").dialog({
	          closeOnEscape: true, // Не срабатывает
	          position: "top",
	          resizable: false,
	          buttons: [
	          {
	              text: "Закрыть 1",
	              click: function() { $(this).dialog( "close" ); } // Не срабатывает
	          }]
	        });

$(".dialogBoxBtn").button();
$(".dialogBoxBtn").click( function() { $("#dialogBox").dialog( "close" ); }); // Не срабатывает

}


В итоге окно и кнопка успешно появляются, но окно не закрывается ни при нажатии на кнопку "Закрыть 1", ни при нажатии на "Закрыть 2", ни при клике вне диалогового окна. Закрыть этот диалог можно только стандартным "крестиком" в заголовке.

Если в click любой из кнопок поместить, к примеру alert(), тот успешно срабатывает. Что я делаю не так?

__________
jQuery 1.4, UI 1.8, от браузера не зависит.

Sufir 05.02.2011 11:21

Извиняюсь, поторопился - не там копал... С ZFDebug'ом конфликт был, после отключения всё прекрасно заработало... Тему можно закрыть.

malivadim 20.09.2014 23:47

Тоже не работает dialog('close')
 
Имею следующее:
<table>
<tr>
<td><a href="#" class="ad_small">объявление 1</a>
<div class="ad_detail" style="display:none">Подробно текст объявления 1</div>
</td>
</tr>
<tr>
<td><a href="#" class="ad_small">объявление 1</a>
<div class="ad_detail" style="display:none">Подробно текст объявления 2</div>
</td>
</tr>
<tr>
<td><a href="#" class="ad_small">объявление 1</a>
<div class="ad_detail" style="display:none">Подробно текст объявления 3</div>
</td>
</tr>
</table>

это у меня таблица с объявлениями, формируется в цикле. У всех ссылок одинаковый класс ad_small,а у дивов ad_detail - это подробный текст объявления.

Так вот, я использую JqueryUI виджет dialog. Я хочу чтобы при наведении на ссылку через секунду появился див, а после того как указатель с ссылки убран,чтобы этот див исчез. Вроде как все просто, а не работает, вот мой код:
$(function($) { 
$('.ad_small').mouseenter(function(){
	var self = this;
        tout=setTimeout(function(){
 	$(self).siblings('.ad_detail').dialog();
       },1000);})
       .mouseout(function(e){
	clearTimeout(tout);
	$(self).siblings('.ad_detail').dialog('close');
 	});
 });

При наведении, через секунду див открывается, но не хочет закрываться при mouseout.
Чую, что что-то с селектором не то.

Пробовал сделать просто без таблицы
<a href="#" class="ad_small">объявление 1</a>
<div class="ad_detail" style="display:none">Подробно текст объявления 1</div>

и код JS:
$(function($) { 
$('.ad_small').mouseenter(function(){
	
        tout=setTimeout(function(){
 	$('.ad_detail').dialog();
       },1000);})
       .mouseout(function(e){
	clearTimeout(tout);
	$('.ad_detail').dialog('close');
 	});
 });

так работает.


Буду очень признателен за помощь.

malivadim 21.09.2014 00:13

Нашел решение, так все ОК:))

$(function($) {
$('.ad_small').mouseenter(function(){
    var self = this;
    n = 0;
    num = $(this).siblings('.ad_detail');
    tout=setTimeout(function(){
    $(self).siblings('.ad_detail').dialog();
    n = 1;
       },1000);})
                       .mouseout(function(e){
                            clearTimeout(tout);
                            if(n){
                                        $(self).siblings('.ad_detail').dialog('destroy');
                                   }
    });
 });


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