设置焦点在AJAX弹出加载文本框

本文关键字:加载 文本 焦点 AJAX 设置 | 更新日期: 2023-09-27 17:51:08

在我的网站,登录窗口打开使用AJAX调用弹出。请参考下面的截图:

$('#hrefLogin').click(function () {
    var url = $('#divLogin').data('request-path');
    $.ajax({
        url: url,
        type: 'GET',
        success: function (data) {
            ////Render the partial view HTML returned by the action method
            $("#divLogin").html(data);
            $.fancybox({
                href: "#divLogin",
                'maxWidth': 420, // set the width
                'minHeight': 400,
                'maxHeight': 400,
                'height':'auto',
                'autoSize': false                
            });
            $.fancybox.update();
            ////Reparse html data to enable MVC data annotation work.
            $('form').removeData('validator');
            $('form').removeData('unobtrusiveValidation');
            $.validator.unobtrusive.parse('form');
        }
    });
});

登录窗口有两个输入字段UserName和Password。当弹出窗口打开时,我需要将焦点设置在UserName字段上。

许多谢谢,

问候,Lalitha

设置焦点在AJAX弹出加载文本框

我将在这里完成我的评论,在我的完整答案中。

我看到你使用了fancybox,所以我看了看它,看到有一个选项,在弹出窗口完成后做一些事情。

所以你的代码中会有这样的内容:

$("#divLogin").html(data);
$.fancybox({
    href: "#divLogin",
    'maxWidth': 420, // set the width
    'minHeight': 400,
    'maxHeight': 400,
    'height':'auto',
    'autoSize': false,
    onComplete : function(){
        $(".username").focus();
    };                
 });
 $.fancybox.update();

所以,焦点在弹出内容显示成功后被更新。

祝你好运,玩得开心。