attr() не изменяет id - jquery

Я хочу изменить идентификатор div после каждого нажатия на него. Но .attr() меняет его только один раз, после первого щелчка.attr() не изменяет id - jquery

$(function(){ 
    $('#m1').click(function(e){ 
    e.preventDefault(); 
    $('#m1').attr("id","m11"); 
    $('#m11').after('<div id="info_cont1">Hello m11 </div>'); 
    }); 

    $('#m11').click(function(e){ 
    e.preventDefault(); 
    $('#m11').attr("id","m1"); 
    $('#m1').after('<div id="info_cont1">Hello m1 </div>'); 
    }); 

});

Любые идеи такого поведения?

источник

2013-10-14 arth81

лучше связать нажмите на класс вместо идентификатора, потому что идентификатор будет меняться один раз нажать на него. –

Используйте класс для селекторов. –

Ваши скрипты запускаются после того, как документ готов, он находит все элементы с id 'm1' и добавляет к ним прослушиватели событий, а затем делает то же самое с элементами с идентификатором' m11', но когда вы загружаете страницу, ваш элемент имеет только один из этих 2 id, поэтому ваш код работает только один раз. – Epsil0neR

Это связано с тем, что вы привязываете вторую .click-функцию к элементу # m11, который не существует в этой точке, но код работает в этой ранней точке. Поэтому использовать делегирование:

$(document).on('click', '#m11', function(event) { 
    // code 
});

SO полный код будет выглядеть так:

$(function(){ 
    // you could actually also use .on() here :) 
    $(document).on('click', '#m1', function(e) { 
     e.preventDefault(); 
     $('#m1').attr("id","m11"); 
     $('#m11').after('<div id="info_cont1">Hello m11 </div>'); 
    }); 

    $(document).on('click', '#m11', function(e) { 
     e.preventDefault(); 
     $('#m11').attr("id","m1"); 
     $('#m1').after('<div id="info_cont1">Hello m1 </div>'); 
    }); 

});

источник

2013-10-14 10:30:41 Alex

Вам также понадобится использовать делегат в первом обработчике кликов, иначе он останется, когда должен быть запущен только второй обработчик кликов. – Guffa

вы правы! – Alex

Это прекрасно работает. Но я делаю это (немного) сложным и снова не работает. Я действительно хочу сделать событие для тега флажка ввода. Я изменяю код, но все же кажется, что это проблема. Элементы формы обрабатываются по-разному .attr(). Во втором комментарии я поставлю код. – arth81

При использовании метода click, он используется в самом начале вашего исполнения сценариев, когда m11 Безразлично» t существует.

Если вы просто хотите, чтобы переключаться между идентификаторами m1 и m11 затем сделать это:

$(function(){ 
    $('#m1').click(function(e){ 
    e.preventDefault(); 
    if($(this).attr('id') == 'm1'){ 
     $(this).attr("id","m11").after('<div id="info_cont1">Hello m11 </div>'); 
    }else{ 
     $(this).attr("id","m1").after('<div id="info_cont1">Hello m1 </div>'); 
    } 
    }); 
});

источник

2013-10-14 10:33:50 shennan

attr() не изменяет id - jquery

ответ

Смежные вопросы