Как изменить заголовок div с помощью jquery

У меня есть следующий код:

<div id="DivPassword" title="test" >

Я хочу изменить заголовок div, и у меня есть следующий код:

 function ChangeAttribute() {
         $("#DivPassword")
            .attr('title', 'Photo by Kelly Clark');
         $('#DivPassword').dialog('open');
         return false;
     }

Когда диалог открывается, заголовок все еще тестируется! если я не назначу какой-либо заголовок div, в диалоговом окне не отображается заголовок. Как я могу исправить это?

 function ChangeAttribute() {
         $("#DivPassword")
            .attr('title', 'Photo by Kelly Clark')
            .dialog('open');

         alert($("#DivPassword").attr('title'));
     }

$('#DivPassword').dialog({
             autoOpen: false,
             width: 800,
             buttons: {
                 "Cancel": function() {
                     $(this).dialog("close");
                 },
                 "Accept": function() {
                 alert($(this).attr('title'));
                     $(this).dialog("close");
                 }
             }
         });

 <script type="text/javascript">
     var Dtitle;
     $(function() {
        $('#DivPassword').dialog({

             autoOpen: false,
             width: 800,
             title : Dtitle,
             buttons: {
                 "Cancel": function() {
                     $(this).dialog("close");
                 },
                 "Accept": function() {
                     $(this).dialog("close");
                 }
             }
         });
     });

     function ChangeAttribute(name) {
         $("#DivPassword")
            .attr('title', name)
            .dialog('open');
         Dtitle = $("#DivPassword").attr('title');
         alert(Dtitle);
     }


</script>

Ответы

Ответ 1

Спасибо за все ответы.

$('#DivPassword').dialog({ должен был после .dialog('open');

Самый простой способ заключался в следующем:

 $("#DivPassword")
            .dialog('open');
         $('#DivPassword').dialog({
             autoOpen: false,
             title: $('#DivPassword').attr('title') + name,
             width: 400,
             buttons: {
                 "Cancel": function() {
                     $(this).dialog("close");
                 },
                 "Accept": function() {
                     $(this).dialog("close");
                 }
             }
         });

Ответ 2

Вы можете напрямую изменить заголовок диалога:

$('#DivPassword').dialog('option', 'title', 'Photo by Kelly Clark');

Это будет работать в вашем случае. Фактически, ваш код для изменения атрибута title правильный. Я предполагаю, что диалоговый плагин создает диалог, когда сначала вызывается .dialog. Открытый метод просто отображает диалоговое окно, но без повторного создания его из div.

Ответ 3

Вы можете изменить ЛЮБОЙ атрибут из любого элемента DOM с помощью jQuery так же просто, как:

$("#divMessage").attr('title', 'Type here the new Title text');

Ура!

Ответ 5

$("#div1").dialog({ autoOpen: false, modal: true, height: 420, width: 750, resizable: false });
// more code
$("#div1").dialog("option", "title", "joopla, here is a new title");

сделал трюк для меня..

Ответ 6

Похоже, ваш плагин читает заголовок, прежде чем он перейдет к этой функции ChangeAttribute. Код, который вы опубликовали, безусловно, изменит атрибут title, так что происходит что-то еще за кулисами.

Кроме того, пока я здесь, не забудьте использовать цепочку. Большинство функций в jQuery снова возвращают один и тот же объект:

$("#DivPassword").attr('title', 'Photo by Kelly Clark').dialog('open');

// or like this, perhaps easier to read:

$("#DivPassword")
    .attr('title', 'Photo by Kelly Clark')
    .dialog('open')
;

Ответ 7

Попробуйте установить атрибут title после открытия диалога. Вероятно, ваш dialog.open() будет сбросить атрибут title.

Я думаю, вы можете предоставить функцию обратного вызова для открытого события.

См. open

Ответ 8

Задает заголовок диалога. название также может быть определено атрибут title в источнике диалога элемент.

Примеры кода

Инициализируйте диалог с указанным параметром title.

$( ".selector" ).dialog( { title: 'Dialog Title' } );

Получить или установить параметр title после init.

//getter
var title = $( ".selector" ).dialog( "option", "title" );
//setter
$( ".selector" ).dialog( "option", "title", 'Dialog Title' );

источник.

чтобы ответить на ваш the dialog doesnt show any title.

Ответ 9

Я сделал это:

$("#div1").dialog({ autoOpen: false, modal: true, height: 420, width: 750, resizable: false });
//more code
$("#div1").dialog("option", "title", "joopla, here is a new title");

Это работает для меня