Question

我在DOM中有一个元素，我将其用作其他表单的模板，最终被克隆多次。由于所有的克隆，我有几个元素具有所有相同的Id。除了删除每个克隆上的id属性之外，我还想删除模板，因为它显示在页面视图中但没有任何内容。我的模板看起来像这样

模板克隆

<div id="listBody">
    <div id="template" class="col-md-3 panel ">
        <div class="panel-body">
            <div class="embed-responsive embed-responsive-4by3 text-light">
                <img class="courseImage embed-responsive-item" src="http://www.w3devcampus.com/wp-content/uploads/logoAndOther/logo_JavaScript.png" alt="cover">
                <div class="embed-overlay"></div>
                <div class="embed-bar embed-bar-bottom">
                    <div class="pull-right">
                        <i class="icon-calendar fa-fw"></i> Sep 12, 2015
                    </div>
                    <div>
                        <a href="#" class="visible mr-1x"><i class="visible icon-share fa-fw"></i> Share</a>
                        <a href="#" class="visible"><i class="icon-star visible fa-fw"></i> Favourites</a>
                    </div>
                </div>
            </div><!-- /.embed -->

            <h4 class="templateName"><strong>@*Course name stuff goes in here*@</strong></h4>
            <p class="help-block"><small>by: <a href="#" class="mr-2x templateInstructor">@*Instructor stuff goes in here*@</a> - <span class="ml-2x"><i class="fa fa-tag fa-fw"></i>@*Course TAGS stuff goes in here*@</span></small></p>
            <p class="templateDescription" width="100px" text-overflow="elipses" overflow="hidden" white-space="nowrap" maxlength="200">@*Description stuff goes in here*@</p>
            <a href="#" id="openModalButton" class="showModal btn btn-sm btn-link text-dark"><i class="fa fa-long-arrow-right fa-fw"></i> READ MORE</a>
        </div><!-- /.panel-body -->
    </div><!-- /.panel -->`

Answer 1

问题的解决方案是

var $ templateClone = $（'＃templateParent'）。find（'。template'）。clone（）; $（ '＃coursesArea'）附加（$ templateClone）;

我通过给它一个“隐藏”属性来隐藏（#templateParent）。（#courseArea）只是我创建的一个容器，用于放置所有内容而不是（#listbody）。

让其他所有内容像上面一样运行，允许多个对象不具有相同的ID。

删除克隆的模板ID

1 个答案: