Jquery $ (это) не работает в селекторе классов

Question

спасибо за ваше время

у меня есть следующий диалог jquery ui

$(function() {
        $( ".dialog" ).dialog({
            title: $(this).attr('name')+'WHYYY',
            autoOpen: false,
            show: "blind",
            hide: "explode"
        });

HTML просто так:

    <div class="dialog" style="" id="helper" name="helper">
    <textarea id="helper_e" name="helper_e">
    some text
    </textarea>
    </div>
<!--and so on with multiple dialog classes with different id's and name's-->

намеревался принять имя в качестве заголовка.

не работает, в заголовке выводится следующее:

UNDEFINEDWHYYY

Почему? спасибо за подсказку

Answer 1

Потому что this НЕ относится к div.dialog, как вы могли бы ожидать.Это относится к window.document вместо.Вы должны переписать это так:

$(function() {
    $('.dialog').each(function() {
        var props = {
            title: $(this).attr('name')+'WHYYY',
            autoOpen: false,
            show: "blind",
            hide: "explode"
        };

        $(this).dialog(props);
    });
});

Answer 2

this не имеет правильного значения в контексте, который вы пытаетесь использовать.

Предполагая, что вы не можете добавить атрибут заголовка, вы можете зациклить элементы в селекторе .dialog и программно добавить заголовок атрибута.

$( ".dialog" )
    .each(function () {
         $(this).attr('title', $(this).attr('name')+'WHYYY');
    }) 
    .dialog({
        autoOpen: false,
        show: "blind",
        hide: "explode"
    });