自动滚动到焦点对准的输入字段表格划分。
我正在克隆表单以添加更多用户,一次添加。
因此,当我单击添加按钮时,它必须向下滚动到输入字段

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/

10-13 06:23