Question

使用jQuery，我试图在AJAX调用之后对输入字段执行.focus（），但到目前为止没有运气。

提出这个想法的小片段：

request.FILES

这是HTML :(由AJAX加载并附加到正文）

$.ajax({
    type: "GET",
    url: url,
    success: function (data) {
        $('#myModal').remove();
        $('body').append(data);
        $('#myModal').modal('show');
    },
    complete: function(){
        $('#input-new-saldo').focus();
    }
});

到目前为止我尝试了什么：

看到其他线程处理相同类型的问题，但解决方案似乎没有帮助。（恩。 Javascript focus does not work on dynamically loaded input box jquery focus not working on a page loaded with ajax）
确保在通话过程中元素存在。确实如此：$（'#input-new-saldo'）;给出正输出。
确保将呼叫发送到正确的元素。确实如此：$（'#input-new-saldo'）。val（'test'）;更改元素的值。

然而，调用$（'＃input-new-saldo'）。focus（）;什么都不做，也没有给出任何JS错误。

对我而言，似乎焦点在AJAX调用期间以某种方式丢失到应用程序之外的某个地方，而且我无法在回调函数中将其窃回。这是否有意义，怎么可能解决？

Answer 1

你很亲密。输入元素可以具有自动对焦属性。

所以代替：

$('#input-new-saldo').focus();

尝试：

$('#input-new-saldo').attr('autofocus' , 'true');

希望这有帮助

Answer 2

$.ajax({
        type: "GET",
        url: url,
        success: function (data) {
            $('#myModal').remove();
            $('body').append(data);
            $('#myModal').modal('show');
            $('#myModal').on('shown', function() {
                $('#input-new-saldo').focus();
            });
        }
    });

Answer 3

奇怪的是，最终找到了直接解决问题的这个帖子https://stackoverflow.com/a/23921617/3963594。

重要的部分是在将事件附加到身体之后将事件绑定到模态，然后再显示它。

自动将焦点设置在动态加载的输入字段上

3 个答案: