Cómo cambiar el título div usando jQuery

tengo el siguiente código:Cómo cambiar el título div usando jQuery

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

quiero cambiar el título div y tengo el siguiente código:

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

Cuando el se abre el diálogo, el título sigue siendo prueba! si no asigno ningún título al div, el cuadro de diálogo no muestra ningún título. ¿Cómo puedo corregir eso?

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>

Fuente

2010-04-23 learning

Gracias por todas las respuestas.

El $('#DivPassword').dialog({ tenían que ser después .dialog('open');

La forma más sencilla era hacer de la siguiente manera:

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

Fuente

2010-04-23 11:45:21 learning

¿Ha intentado alguna de las sugerencias dadas aquí: How to change an element’s title attribute using jQuery?

Parece que está haciendo lo que sugiere la respuesta aceptada. Si esto no funciona, quizás los otros lo harán.

Fuente

2010-04-23 06:46:14 AaronThomson

¡Estoy bastante perplejo, ninguna de las respuestas anteriores funcionó! – learning

Parece que su complemento está leyendo el título antes de llegar a esa función ChangeAttribute. El código que ha publicado ciertamente cambiará el atributo de título, por lo que hay algo más detrás de escena.

Además, mientras estoy aquí, no te olvides de usar el encadenamiento. La mayoría de las funciones en jQuery devuelven el mismo objeto nuevamente:

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

Fuente

2010-04-23 06:51:10 nickf

He intentado agregar alertas ... como en el código editado arriba. Pero a pesar de que bothalerts muestra el título correcto, el título no se muestra. – learning

Intente configurar el atributo del título después de que se abra el cuadro de diálogo. Probablemente su dialog.open() restablecerá el atributo de título.

Creo que puede proporcionar una función de devolución de llamada para el evento abierto.

Ver open

Fuente

2010-04-23 06:51:17 rahul

Si se hubiera reiniciado, ¡entonces no creo que se haya mostrado el título inicial! ¿Qué piensas sobre eso? El nuevo título que se está asignando no se muestra. – learning

Puede cambiar el título de un cuadro de diálogo directamente con:

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

Esto funcionará en su caso. De hecho, su código para cambiar el atributo del título es correcto. Supongo que el complemento de diálogo crea el diálogo cuando se llama primero a .dialog. El método abierto solo muestra el diálogo, sin volver a crearlo desde div.

Fuente

2010-04-23 06:52:50

He cambiado el código como en la parte editada arriba. Aún así, no puedo explicar por qué no está funcionando. – learning

Aún no usa el método de diálogo para establecer el título. Puede agregar mi línea justo antes de su declaración de alerta y debería funcionar. –

funciona perfecto: estaba probando todas estas otras formas desde diferentes publicaciones y artículos. Esta es claramente la solución más elegante ... ¡también conocido como el mejor! He estado aprendiendo/trabajando con diálogos de jquery durante algunos meses, y solo veo esta forma de hacer las cosas por primera vez aquí. No estoy seguro de por qué los documentos, tuts y publicaciones no enfatizan más este tipo de solución ya que es muy útil/poderoso en muchas situaciones de código diferentes ...? Muchas gracias por compartir un excelente one-line – gnB

Especifica el título del cuadro de diálogo. El título también se puede especificar mediante el atributo de título en el elemento fuente de diálogo.

Ejemplos de código

inicializar un diálogo con la opción de título especificado.

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

Obtenga o establezca la opción de título, después de iniciar.

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

source.

para responder a su the dialog doesnt show any title.

Fuente

2010-04-23 06:59:15 Reigel

Hice esto:

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

Esto funciona para mí

Fuente

2010-04-23 12:02:22 Michel

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

hizo el truco para mí ..

Fuente

2011-06-27 21:53:47

Puede cambiar cualquiera attr de cualquier elemento DOM con jQuery tan fácil como:

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

Salud!

Fuente

2014-07-25 17:34:40 Jhollman

Cómo cambiar el título div usando jQuery

Respuesta

Cuestiones relacionadas