简体   繁体   中英

how to set focus for the pop-up window?

In my web page I have opened a notification pop-up window which contains some message. My need is after opening that pop-up the focus should navigate in that particular window not in the main web.

I used the below codes to open the pop-up window

<div class="cd-popup">
        <div class="cd-popup-container">
            <asp:GridView runat="server"
                ID="gvNotificationsShow"
                                    AllowPaging="True"
                AutoGenerateColumns="False"
                                    GridLines="None"
                ShowHeader="true"
                class="tablemaster">
                <Columns>
                    <asp:TemplateField HeaderText="" ItemStyle-CssClass="Grid">
                        <HeaderTemplate><span class="headerGradient">Notifications list</span></HeaderTemplate>
                        <ItemTemplate>
                            <asp:Label ID="lblNotification" runat="server" Text='<%# Eval("NotificationText").ToString().Replace("\n","<br/>") %>' />
                        </ItemTemplate>
                    </asp:TemplateField>
                </Columns>
                <PagerStyle HorizontalAlign="Center" />
            </asp:GridView>

            <a href="#" id="notify" onclick="openMarkup()" class="cd-popup-close">
                <img src="../Lib/UI/img/noimage.png" class="transparent" alt="no image"></a>
        </div>
        <!-- cd-popup-container -->
    </div>

Since you haven't provided your JavaScript for openMarkup method, I will assume that you have a variable called popupWindow in that method. Then, to move focus to the popup window, you could use JavaScript as below.

var popupWindow = window.open('xyz.aspx');//you could have more parameters passed to open method
if(window.focus) {
     popupWindow.focus();
}

Check this(requires Jquery)

$(document).on('keyup keypress', function (e) {
    var keyCode = e.keyCode || e.which;
    if (keyCode === 9) {
    if($('#popupelementid').is(':visible'))
     {
        e.preventDefault();
        return false;
     }
    }
});

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM