Соедините два div через jquery - все, что происходит внутри одного, происходит в другом

Question

Соедините два div через jquery - все, что происходит внутри одного, происходит в другом

0

Я помню, когда я играл с Flash около 10 лет назад. Я мог бы создать клип, чем дублировать его, и что бы я ни делал с клипом 1, автоматически автоматически изменил бы дублированный элемент - так что в сущности это были два окна одной и той же вещи.

Интересно, возможно ли такое с элементами dom. Я хотел бы клонировать элемент, и все, что происходит с оригиналом, должно происходить и для клонирования. В том, что я имею в виду, нажмите события и классы в основном.

Это html:

<li id="67" data-word-id="2" data-order-id="1" class="ui-state-default">
    <article>
    Some content...
    <div class="invisible active" data-invisi-status"1"="" title="Do you want to keep this item private and invisible to anyone except for you?">Make word invisible</div>
    </article>
</li>

Я хочу сохранить невидимый значок активного класса и статус, синхронизированный между скопированными элементами.

Я получаю копирование из одного списка в другой:

$(this).removeClass("ui-sortable-helper").css({"height":"auto"}).clone().appendTo($list).show("slow");

Как я буду держать это синхронизированным?

ahren 27 нояб. 2013, в 15:45

Источник

Теги:

javascript

jquery

html

1 ответ

Ещё вопросы

ahren · Accepted Answer · 2013-11-27T12-23-00.000Z

Использование классов влияет на все элементы DOM этого класса. Поэтому, я думаю, вы могли бы подумать о flash-клипе как о элементе DOM с определенным классом.

$('.my-clip').removeClass('ui-sortable-helper');

.my-clip бы класс ui-sortable-helper из всех элементов с классом .my-clip

Тем не менее, существуют определенные методы, которые работают только на одном элементе, и он обычно является первым в выборе.

Если вы привязываете обработчик событий к чему-то внутри .my-clip, скажем, например, ссылку, а затем ссылаетесь на нее с использованием this переменной, вы обновляете только элемент, инициировавший событие.

Например:

$('.my-clip').on('click', 'a', function(e){
  $(this).addClass('link-clicked');
});

Это только добавило бы link-clicked на ссылку на ссылку на ссылку, которая вызвала событие, однако, если вы это сделали:

$('.my-clip').on('click', 'a', function(e){
  $('.my-clip').find('a').addClass('link-clicked');
});

Было бы добавить класс link-clicked всем a элементы во всех случаях .my-clip

Можно даже расширить это, если есть ссылки, а что нет, используйте .myclass <element> и экземпляр this
@tymeJV - конечно, готово. Вероятно, это не лучший пример - я открыт для предложений!
Выглядит хорошо, это, вероятно, самый близкий способ получить элементы "клонировать" друг друга вместе с обработчиками
Это круто. Но моя проблема в том, что иногда мне нужно использовать $ (this), когда нет клона. И иногда я должен использовать класс. Мне придется написать много условных выражений ... Но я думаю, что это решение, и другого более легкого пути нет.