Javascript-форум (https://javascript.ru/forum/)
-   Элементы интерфейса (https://javascript.ru/forum/dom-window/)
-   -   обратиться к элементу внутри div (https://javascript.ru/forum/dom-window/47849-obratitsya-k-ehlementu-vnutri-div.html)

nubas 10.06.2014 01:15

обратиться к элементу внутри div
 
Здравствуйте, помогите пожалуйста разобраться со следующей проблемой.
Есть драггабл элемент, при добавлении которого на форму, создаются див блок с кнопкой внутри. Кнопке присваивается определенный id и когда я пытаюсь обратиться к ней напрямую по id, ничего не происходит, не могу понять почему.
Мне нужно по клику на кнопку вызывать палитру цветов и менять background color кнопки, но для начала я пытаюсь задать какой-то определенный текст.
Вот пример http://jsfiddle.net/3nDmH/
Т.е. по идее при нажатии на элемент с ид theButton должен меняться бэкграунд, но этого не происиходт, скорее всего у меня максимум говнокод, вообщем кто-нибудь может подсказать в чем проблема?

рони 10.06.2014 02:08

функцию -- создали элемент тогда и вешайте обработчики или вешайте обработчик не на сам элемент а на тот где он появится -- делегирование называется функция on
http://jsfiddle.net/3nDmH/1/

nubas 10.06.2014 02:20

Спасибо большое) Удивительно то, что у меня почему-то этот год не работает, а в jsfiddle действительно все норм.
И еще почему-то скрипт применяется только к первой кнопке, которую перетаскивают на форму, на последующие кнопки он уже никак не реагирует...
НЕ подскажете почему? Где искать, что смотреть?)

рони 10.06.2014 02:22

nubas,
потому что вы незнаите что такое id и как использовать on

nubas 10.06.2014 02:25

Теперь понял

рони 10.06.2014 02:34

nubas,
вот что у вас могло быть для 1 элемента
$('#droppable').on('click', '#theButton', function() {
                $(this).css('background-color', 'red');
            });

а лучше так для многих класс
$('#droppable').on('click', '.Ваш_Класс', function() {
                $(this).css('background-color', 'red');
            });


добавляется 1 раз .

nubas 10.06.2014 02:39

Да это же просто божественно!) Так значительно лучше, Вы гений)
Спасибо огромное!

рони 10.06.2014 02:47

nubas,
документацию читайте
можно и так ещё
var tmp = $("<input>", {css: {height: '100%', width: "100%" },type: 'button', value: 'Button', click : function() {
                $(this).css('background-color', 'red');
            }});


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