Изменение нумерации упорядоченных идентификаторов div при добавлении одного в середине с Javascript

Я разрабатываю приложение с помощью JavaScript. Что мне нужно, так это иметь div с id (1,2,3...) и иметь возможность вставлять div между, например, 2 и 3, с помощью jquery, а затем иметь новые три, и три становится четыре, четыре становится пятью и т. д. У меня работает вставка div, мне просто нужно знать, как изменить порядок div. Есть идеи?

Источник

4 ответа

Решение

После того, как вы вставили новый div, вы можете сделать это:

var i = 1;
$('div').each(function() {
    $(this).attr('id', i++);
});

Замените $('div') на свой собственный селектор.

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

Источник 
$(function() {

  reorder();

  $('#click').click(function() {

    $('<h2>hello world blah!</h2>').insertAfter('.content h2:eq(1)');
    reorder();
  });

});

function reorder() {
 $('.content h2').each(function(i) {
    $(this).attr('id', 'order_'+(i+1));
 // alert( parseInt(this.id.split('_')[1]) ); // this is the id #
 });
};
Источник

Вы не можете начать идентификаторы с числового значения, но независимо от того, что вы бы сделали что-то вроде

// set a data value in the div you have just inserted into the dom and set a variable theID to the current ID you have just inserted.

$(this).data('inserted', true);
var theID = $(this).attr('id'); // this will be 3.


// now to update the other divs.
$('div').each(function() {
    if($(this).attr('id') >= theID && !$(this).data('inserted')){
        $(this).attr('id', $(this).attr('id') + 1);
    }
});

// now set the data inserted to false for future updates
$('div#3').data('inserted', false);
Источник

Я почти уверен, что вы возвращаете вещи в DOM-порядке от селекторов jQuery, поэтому вы не можете просто найти родительский элемент, выбрать дочерний <div> элементы, а затем .each() через список?

Источник
Другие вопросы по тегам