Можно ли показывать HTML-элемент уже на странице во второй раз, не копируя его?

Question

У меня есть страница со скрытой формой, содержащей несколько элементов div.

<form action="...">
    <div>
        <input id="menubar_open_article_bid" name="bid" onfocus="this.select();" onkeyup="do_v(); type="text">
        <a href="#"  onclick="return do_h();">
            Beitrag öffnen                              </a>
    </div>
    <div>
        <input id="menubar_open_article_cid" name="cid" onfocus="this.select();" onkeyup="do_a();" type="text">
        <a href="#" onclick="return do_y();">
            Container öffnen                                </a>
    </div>
    <div>
        <input  id="menubar_open_article_iid" name="iid" onfocus="this.select();" onkeyup="do_b();" type="text">
        <a href="#" onclick="return do_x();">
            Inhalt öffnen                               </a>
    </div>
</form>

В качестве первой попытки я скопировал один из элементов div, используя jQuery, в другую форму, чтобы показать его там (видно). Это прекрасно работало, но теперь идентификатор элемента html присутствует дважды.

Я не хочу менять этот идентификатор. Таким образом, решение, где я мог бы только ссылаться на div с идентификатором "menubar_open_article_iid", чтобы показать html-элемент, решило бы мою проблему. Это возможно? (хотя я никогда не слышал о чем-то подобном)

Answer 1

Может быть, вы можете использовать этот подход:

Я бы использовал метаданные jQuery и jQuery: http://plugins.jquery.com/project/metadata

В скрытой форме не указывайте идентификаторы. Вместо этого укажите, что вы хотите, чтобы идентификаторы были через метаданные класса :

<form class="hide form-to-clone">
    <div>
        <input class="setId {id:'id1'}" />
    </div>
    <div>
        <input class="setId {id:'id2'}" />
    </div>
    <div>
        <input class="setId {id:'id3'}" />
    </div>
</form>

В jQuery клонируйте скрытую форму:

var clone = $('.form-to-clone').clone();

Затем переберите элементы в клоне и установите идентификаторы:

clone.find('.setId').each(function() {
   var $this = $(this);
   $this.attr('id', $this.metadata().id);
});

Затем добавьте клонированную форму на страницу:

clone.show().appendTo('body');

Answer 2

Насколько я знаю, это невозможно.

Я думаю, что главная проблема здесь в том, что вы хотите, чтобы один вход показывался дважды, но при этом оставался одним и тем же входом.Это будет проблематично, и это также плохой дизайн интерфейса.Скорее всего, пользователь будет смущен наличием двух отдельных, но разных входных данных в форме.

Я бы порекомендовал вам не делать этого.