尝试生成一些动态div html内容。我使用var content = $('#dynamicAddRow0').html();
来获取div内容。
我正在获取div内容,问题在于div内容选择标记会出现两次。以下是我的代码
<div id="dynamicAddRow0">
<div class="clear-block">
<div class="col-sm-4 col-md-4">
<div class="form-group cc">
<label for="reToSeperate" id="test">From</label>
<div class="col-sm-6 col-md-6 no-padding">
<form:select class="selectpicker" path="hraList[0].fromMonth">
<option value=""><c:out value="Select"></c:out></option>
<c:forEach items="${monthsList}" var="commute">
<option value="${commute}"><c:out value="${commute}"></c:out></option>
</c:forEach>
</form:select>
</div>
<div class="col-sm-6 col-md-6 no-right-pad">
<form:select class="selectpicker" path="hraList[0].fromYear" required="required">
<option value=""><c:out value="Select"></c:out></option>
<c:forEach items="${yearsList}" var="commute">
<option> <c:out value="${commute}"></c:out></option>
</c:forEach>
</form:select>
</div>
</div>
</div>
<div class="col-sm-4 col-md-4">
<div class="form-group cc">
<label for="reToSeperate">To</label>
<div class="col-sm-6 col-md-6 no-padding">
<form:select class="selectpicker" path="hraList[0].toMonth" required="required">
<option value=""><c:out value="Select"></c:out></option>
<c:forEach items="${monthsList}" var="commute">
<option><c:out value="${commute}"></c:out></option>
</c:forEach>
</form:select>
</div>
<div class="col-sm-6 col-md-6 no-right-pad">
<form:select class="selectpicker" path="hraList[0].toYear" required="required">
<option value=""><c:out value="Select"></c:out></option>
<c:forEach items="${yearsList}" var="commute">
<option><c:out value="${commute}"></c:out></option>
</c:forEach>
</form:select>
</div>
</div>
</div>
</div>
</div>
当我在控制台中运行$('#dynamicAddRow0').html()
时,我得到以下输出:
<div class="clear-block">
<div class="col-sm-4 col-md-4">
<div class="form-group cc">
<label id="test" for="reToSeperate">From</label>
<div class="col-sm-6 col-md-6 no-padding">
<select id="hraList0.fromMonth" name="hraList[0].fromMonth" class="selectpicker" style="display: none;" disabled="disabled">
<option value="">Select</option>
<option value="Jan">Jan</option>
<option value="Feb">Feb</option>
<option value="Mar">Mar</option>
<option value="Apr">Apr</option>
<option value="May">May</option>
<option value="Jun">Jun</option>
<option value="Jul">Jul</option>
<option value="Aug">Aug</option>
<option value="Sep">Sep</option>
<option value="Oct">Oct</option>
<option value="Nov">Nov</option>
<option value="Dec">Dec</option>
<option value=""></option>
</select>
<div class="btn-group bootstrap-select">
<button type="button" class="btn dropdown-toggle selectpicker btn-default" data-toggle="dropdown" data-id="hraList0.fromMonth" title="Jan" value="" disabled="disabled"><span class="filter-option pull-left">Jan</span> <span class="caret"></span></button>
<div class="dropdown-menu open">
<ul class="dropdown-menu inner selectpicker" role="menu">
<li data-original-index="0"><a tabindex="0" class="" data-normalized-text="<span class="text">Select</span>"><span class="text">Select</span><span class="glyphicon undefined check-mark"></span></a></li>
<li data-original-index="1" class="selected"><a tabindex="0" class="" data-normalized-text="<span class="text">Jan</span>"><span class="text">Jan</span><span class="glyphicon undefined check-mark"></span></a></li>
<li data-original-index="2"><a tabindex="0" class="" data-normalized-text="<span class="text">Feb</span>"><span class="text">Feb</span><span class="glyphicon undefined check-mark"></span></a></li>
<li data-original-index="3"><a tabindex="0" class="" data-normalized-text="<span class="text">Mar</span>"><span class="text">Mar</span><span class="glyphicon undefined check-mark"></span></a></li>
<li data-original-index="4"><a tabindex="0" class="" data-normalized-text="<span class="text">Apr</span>"><span class="text">Apr</span><span class="glyphicon undefined check-mark"></span></a></li>
<li data-original-index="5"><a tabindex="0" class="" data-normalized-text="<span class="text">May</span>"><span class="text">May</span><span class="glyphicon undefined check-mark"></span></a></li>
<li data-original-index="6"><a tabindex="0" class="" data-normalized-text="<span class="text">Jun</span>"><span class="text">Jun</span><span class="glyphicon undefined check-mark"></span></a></li>
<li data-original-index="7"><a tabindex="0" class="" data-normalized-text="<span class="text">Jul</span>"><span class="text">Jul</span><span class="glyphicon undefined check-mark"></span></a></li>
<li data-original-index="8"><a tabindex="0" class="" data-normalized-text="<span class="text">Aug</span>"><span class="text">Aug</span><span class="glyphicon undefined check-mark"></span></a></li>
<li data-original-index="9"><a tabindex="0" class="" data-normalized-text="<span class="text">Sep</span>"><span class="text">Sep</span><span class="glyphicon undefined check-mark"></span></a></li>
<li data-original-index="10"><a tabindex="0" class="" data-normalized-text="<span class="text">Oct</span>"><span class="text">Oct</span><span class="glyphicon undefined check-mark"></span></a></li>
<li data-original-index="11"><a tabindex="0" class="" data-normalized-text="<span class="text">Nov</span>"><span class="text">Nov</span><span class="glyphicon undefined check-mark"></span></a></li>
<li data-original-index="12"><a tabindex="0" class="" data-normalized-text="<span class="text">Dec</span>"><span class="text">Dec</span><span class="glyphicon undefined check-mark"></span></a></li>
<li data-original-index="13"><a tabindex="0" class="" data-normalized-text="<span class="text"></span>"><span class="text"></span><span class="glyphicon undefined check-mark"></span></a></li>
</ul>
</div>
</div>
</div>
<div class="col-sm-6 col-md-6 no-right-pad">
<select id="hraList0.fromYear" name="hraList[0].fromYear" class="selectpicker" required="required" aria-required="true" style="display: none;" disabled="disabled">
<option value="">Select</option>
<option>2017</option>
<option>2018</option>
</select>
<div class="btn-group bootstrap-select">
<button type="button" class="btn dropdown-toggle selectpicker btn-default" data-toggle="dropdown" data-id="hraList0.fromYear" title="2017" value="" disabled="disabled"><span class="filter-option pull-left">2017</span> <span class="caret"></span></button>
<div class="dropdown-menu open">
<ul class="dropdown-menu inner selectpicker" role="menu">
<li data-original-index="0"><a tabindex="0" class="" data-normalized-text="<span class="text">Select</span>"><span class="text">Select</span><span class="glyphicon undefined check-mark"></span></a></li>
<li data-original-index="1" class="selected"><a tabindex="0" class="" data-normalized-text="<span class="text">2017</span>"><span class="text">2017</span><span class="glyphicon undefined check-mark"></span></a></li>
<li data-original-index="2"><a tabindex="0" class="" data-normalized-text="<span class="text">2018</span>"><span class="text">2018</span><span class="glyphicon undefined check-mark"></span></a></li>
</ul>
</div>
</div>
</div>
</div>
</div>
<div class="col-sm-4 col-md-4">
<div class="form-group cc">
<label for="reToSeperate">To</label>
<div class="col-sm-6 col-md-6 no-padding">
<select id="hraList0.toMonth" name="hraList[0].toMonth" class="selectpicker" required="required" aria-required="true" style="display: none;" disabled="disabled">
<option value="">Select</option>
<option>Jan</option>
<option>Feb</option>
<option>Mar</option>
<option>Apr</option>
<option>May</option>
<option>Jun</option>
<option>Jul</option>
<option>Aug</option>
<option>Sep</option>
<option>Oct</option>
<option>Nov</option>
<option>Dec</option>
<option></option>
</select>
<div class="btn-group bootstrap-select">
<button type="button" class="btn dropdown-toggle selectpicker btn-default" data-toggle="dropdown" data-id="hraList0.toMonth" title="Aug" value="" disabled="disabled"><span class="filter-option pull-left">Aug</span> <span class="caret"></span></button>
<div class="dropdown-menu open">
<ul class="dropdown-menu inner selectpicker" role="menu">
<li data-original-index="0"><a tabindex="0" class="" data-normalized-text="<span class="text">Select</span>"><span class="text">Select</span><span class="glyphicon undefined check-mark"></span></a></li>
<li data-original-index="1"><a tabindex="0" class="" data-normalized-text="<span class="text">Jan</span>"><span class="text">Jan</span><span class="glyphicon undefined check-mark"></span></a></li>
<li data-original-index="2"><a tabindex="0" class="" data-normalized-text="<span class="text">Feb</span>"><span class="text">Feb</span><span class="glyphicon undefined check-mark"></span></a></li>
<li data-original-index="3"><a tabindex="0" class="" data-normalized-text="<span class="text">Mar</span>"><span class="text">Mar</span><span class="glyphicon undefined check-mark"></span></a></li>
<li data-original-index="4"><a tabindex="0" class="" data-normalized-text="<span class="text">Apr</span>"><span class="text">Apr</span><span class="glyphicon undefined check-mark"></span></a></li>
<li data-original-index="5"><a tabindex="0" class="" data-normalized-text="<span class="text">May</span>"><span class="text">May</span><span class="glyphicon undefined check-mark"></span></a></li>
<li data-original-index="6"><a tabindex="0" class="" data-normalized-text="<span class="text">Jun</span>"><span class="text">Jun</span><span class="glyphicon undefined check-mark"></span></a></li>
<li data-original-index="7"><a tabindex="0" class="" data-normalized-text="<span class="text">Jul</span>"><span class="text">Jul</span><span class="glyphicon undefined check-mark"></span></a></li>
<li data-original-index="8" class="selected"><a tabindex="0" class="" data-normalized-text="<span class="text">Aug</span>"><span class="text">Aug</span><span class="glyphicon undefined check-mark"></span></a></li>
<li data-original-index="9"><a tabindex="0" class="" data-normalized-text="<span class="text">Sep</span>"><span class="text">Sep</span><span class="glyphicon undefined check-mark"></span></a></li>
<li data-original-index="10"><a tabindex="0" class="" data-normalized-text="<span class="text">Oct</span>"><span class="text">Oct</span><span class="glyphicon undefined check-mark"></span></a></li>
<li data-original-index="11"><a tabindex="0" class="" data-normalized-text="<span class="text">Nov</span>"><span class="text">Nov</span><span class="glyphicon undefined check-mark"></span></a></li>
<li data-original-index="12"><a tabindex="0" class="" data-normalized-text="<span class="text">Dec</span>"><span class="text">Dec</span><span class="glyphicon undefined check-mark"></span></a></li>
<li data-original-index="13"><a tabindex="0" class="" data-normalized-text="<span class="text"></span>"><span class="text"></span><span class="glyphicon undefined check-mark"></span></a></li>
</ul>
</div>
</div>
</div>
<div class="col-sm-6 col-md-6 no-right-pad">
<select id="hraList0.toYear" name="hraList[0].toYear" class="selectpicker" required="required" aria-required="true" style="display: none;" disabled="disabled">
<option value="">Select</option>
<option>2017</option>
<option>2018</option>
</select>
<div class="btn-group bootstrap-select">
<button type="button" class="btn dropdown-toggle selectpicker btn-default" data-toggle="dropdown" data-id="hraList0.toYear" title="2017" value="" disabled="disabled"><span class="filter-option pull-left">2017</span> <span class="caret"></span></button>
<div class="dropdown-menu open">
<ul class="dropdown-menu inner selectpicker" role="menu">
<li data-original-index="0"><a tabindex="0" class="" data-normalized-text="<span class="text">Select</span>"><span class="text">Select</span><span class="glyphicon undefined check-mark"></span></a></li>
<li data-original-index="1" class="selected"><a tabindex="0" class="" data-normalized-text="<span class="text">2017</span>"><span class="text">2017</span><span class="glyphicon undefined check-mark"></span></a></li>
<li data-original-index="2"><a tabindex="0" class="" data-normalized-text="<span class="text">2018</span>"><span class="text">2018</span><span class="glyphicon undefined check-mark"></span></a></li>
</ul>
</div>
</div>
</div>
</div>
</div>
</div>
我不明白为什么第二个选择标签即将到来且哪个不可选。请帮我解决这个问题。 在此先感谢。