dialog( "close" ) не работает

[Sufir]

Не срабатывает "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]

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

[malivadim]

Имею следующее:

<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]

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

$(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');
                                   }
    });
 });