自动滚动到焦点对准的输入字段表格划分。
我正在克隆表单以添加更多用户,一次添加。
因此,当我单击添加按钮时,它必须向下滚动到输入字段
HTML:
$(document).ready(function() {
$('#id_i_fa_add').click(function duplicate() {
$('#id_i_fa_add').off('click');
$('.fa.fa-trash').off('click');
var original = document.getElementById('id_div_add' + i);
var clone = original.cloneNode(true);
$('#' + clone.id + " a i").attr('class', 'fa fa-trash');
$('#' + clone.id + " a i").attr('id', 'id_i_fa_del' + i);
clone.id = "id_div_add" + ++i;
clone.querySelectorAll("[id = 'id_span_error_email" + (i - 1) + "']")[0].id = 'id_span_error_email' + i;
$(clone).find('input').val("");
$(clone).find('span').text("");
document.getElementById('id_form_append').appendChild(clone);
$('#id_form_append input').focus();
$('#id_i_fa_add').on('click', duplicate);
$('.fa.fa-trash').on('click', duplicate_trash);
});
});
function duplicate_trash() {
var trash_id = this.id;
var parent_trash_id = $('#' + trash_id).parents().eq(1).attr('id');
$('#' + parent_trash_id).remove()
}
<form id='id_form_append' action="#">
<div id='id_div_append'>
<div id='id_div_add0' class="panel_box">
<div class="form_group">
<label>Email Address</label>
<div class="form-group form-inline">
<div class="input-group" style="width: 100%;">
<input name="email" type="text" class="form-control" placeholder="e-mail" autofocus>
<div class="input-group-addon">domains</div>
</div>
</div>
<span id='id_span_error_email0' class='class_span0'></span>
</div>
<a class="action" href="#">
<i id='id_i_fa_add' class="fa fa-plus"></i>
</a>
</div>
</div>
</form>
最佳答案
您可以使用以下方法滚动到某个位置:
$(window).scrollTop(/* pixel count */)
要检索任何元素的位置,请使用:
$(/* selector */).position()
然后,您将获得一个包含所选元素位置的简单对象。要检索顶部像素,请使用:
$(/* selector */).position().top
注意:仅当选择器仅选择一个元素时,此方法才能正常工作。
〜法比安
关于javascript - 多次克隆表单时,如何使用javascript或jquery自动滚动到关注的输入字段划分,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/33450340/