Javascript Jquery在弹出窗口上阻止UI_Javascript_Jquery_Html_Asp.net_Css

Javascript Jquery在弹出窗口上阻止UI

javascript jquery html asp.net css

Javascript Jquery在弹出窗口上阻止UI,javascript,jquery,html,asp.net,css,Javascript,Jquery,Html,Asp.net,Css,我已经创建了一个应用程序，我想在加载时阻止UI。单击按钮，新弹出窗口将打开，我想在加载时阻止弹出窗口UI。实际上，我编写的代码将在新的弹出窗口中打开窗口，我想阻止UI，直到加载完整的页面。加载时，我没有为阻塞UI创建任何JQUERY <asp:Content ID="Content1" ContentPlaceHolderID="head" Runat="Server"> <link rel="stylesheet" type="text/css" href="cont

我已经创建了一个应用程序，我想在加载时阻止UI。单击按钮，新弹出窗口将打开，我想在加载时阻止弹出窗口UI。实际上，我编写的代码将在新的弹出窗口中打开窗口，我想阻止UI，直到加载完整的页面。加载时，我没有为阻塞UI创建任何JQUERY

<asp:Content ID="Content1" ContentPlaceHolderID="head" Runat="Server">
    <link rel="stylesheet" type="text/css" href="contentslider.css" />  
    <link rel="stylesheet" type="text/css" href="js/jquery-ui.css" />  
    <script type="text/javascript">
        $(function () {
            $("#tabs").tabs();
        });
    </script>
<script type="text/javascript" src="js/contentslider.js">
</script>
<script type="text/javascript" src="js/contentslider1.js">
</script>
<script type="text/javascript" src="js/contentslider2.js">
</script>
<script type="text/javascript" src="js/contentslider3.js">
</script>
<script type="text/javascript" src="js/contentslider4.js">
</script> 

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" Runat="Server">

    <div id="tabs">
        <%# Eval("Qsnsubject")%>
        <asp:Repeater ID="TablLinkRepeater" runat="server">
            <HeaderTemplate>
                <ul>
            </HeaderTemplate>
            <ItemTemplate>            
                <li><a href="#Tab<%#(((RepeaterItem)Container).ItemIndex).ToString() %>"><%# Eval("Qsnsubject")%>
                   </a></li>
            </ItemTemplate>
            <FooterTemplate>
                </ul>
            </FooterTemplate>
        </asp:Repeater>

        <%-- Tabs and Content --%>
        <asp:Repeater ID="TabRepeater" runat="server">
            <ItemTemplate>
                <div id="Tab<%#(((RepeaterItem)Container).ItemIndex).ToString() %>">                    
                 <div id="slider<%#(((RepeaterItem)Container).ItemIndex).ToString() %>" class="sliderwrapper"> 
                    <asp:Repeater ID="ContentRepeater" runat="server">
                        <ItemTemplate>                        
                            <div class="Content" id="ContentDiv" runat="server">                                  
                            <div  class="contentdiv">
                            <asp:PlaceHolder ID="PlPreview" runat="server"></asp:PlaceHolder>   
                                <br>                                             
                               <input id="r" class="reset" data-info="<%# Eval("ContentIndex") %>" type="button" value="Reset" />
                               <input id="m" class="Mark" data-info="<%# Eval("ContentIndex")  %>" type="button" value="Mark as review" />
                               <input id="u" class="Unmark" data-info="<%# Eval("ContentIndex")  %>" type="button" value="Unmark as Review"  />
                            </div>
                            </div>
                        </ItemTemplate>
                    </asp:Repeater>
                 </div>
                 <div id="paginate-slider<%#(((RepeaterItem)Container).ItemIndex).ToString() %>" class="pagination"> 
                </div>
                 <div id="paginate1-slider<%#(((RepeaterItem)Container).ItemIndex).ToString() %>" class="pagination2">    

                          </div>

                </div>

            </ItemTemplate>
        </asp:Repeater>
         <div class="pagination2" style="text-align:right">
                          <asp:Button ID="btnsubmit" runat="server" Text="Submit" BorderStyle="Inset" 
                              Width= "100px" Height="40px"
                              ToolTip="Click to Submit the Exam" onclick="btnsubmit_Click" /></div> 
   </div>

    <div>

        </div>

<script type="text/javascript">
    $(document).ready(function () {
        $('#slider0').block({ message: '<h1>WELCOME! Press Next to show questions</h1>',
            css: { border: '3px solid #a00' }
        });

    });   
    $(".pagination").click(function () {
        $('#slider0').unblock();       
    });
    $(".pagination2").click(function () {
        $('#slider0').unblock();
    });
    featuredcontentslider.init({
        id: "slider0",
        contentsource: ["inline", ""],
        toc: "#increment",
        nextprev: ["Previous", "Next"],
        revealtype: "click",
        enablefade: [true, 0.2],
        autorotate: [true, 3000],
        onChange: function (previndex, curindex, contentdivs) {
        }


    })

</script>  
<script type="text/javascript">

    featuredcontentslider1.init({
        id: "slider1",
        contentsource: ["inline", ""],
        toc: "#increment",
        nextprev: ["Previous", "Next"],
        revealtype: "click",
        enablefade: [true, 0.2],
        autorotate: [true, 3000],
        onChange: function (previndex, curindex, contentdivs) {
        }


    })

</script>
<script type="text/javascript">

    featuredcontentslider2.init({
        id: "slider2",
        contentsource: ["inline", ""],
        toc: "#increment",
        nextprev: ["Previous", "Next"],
        revealtype: "click",
        enablefade: [true, 0.2],
        autorotate: [true, 3000],
        onChange: function (previndex, curindex, contentdivs) {
        }


    })

</script>
<script type="text/javascript">

    featuredcontentslider3.init({
        id: "slider3",
        contentsource: ["inline", ""],
        toc: "#increment",
        nextprev: ["Previous", "Next"],
        revealtype: "click",
        enablefade: [true, 0.2],
        autorotate: [true, 3000],
        onChange: function (previndex, curindex, contentdivs) {
        }


    })

</script>
<script type="text/javascript">

    featuredcontentslider4.init({
        id: "slider4",
        contentsource: ["inline", ""],
        toc: "#increment",
        nextprev: ["Previous", "Next"],
        revealtype: "click",
        enablefade: [true, 0.2],
        autorotate: [true, 3000],
        onChange: function (previndex, curindex, contentdivs) {
        }


    })

</script> 

<script>

    $('input[type=radio]').click(function (e) {
        thisdata = $(this).attr('data-info');
        $("#pno" + thisdata).css("background-color", "Green");
       });

    $(".reset").click(function () {
        thisdata = $(this).attr('data-info');
        $('input[data-info=' + thisdata + ']').attr('checked', false);
        $("#pno" + thisdata).css("background-color", "Red");       
    });
    $(".Mark").click(function () {
        thisdata = $(this).attr('data-info');
        if ($('input[data-info=' + thisdata + ']').is(':checked'))
        {
            $("#pno" + thisdata).css("background-color", 'RGB(128,0,128)');
        }
    });
    $(".Unmark").click(function () {
        thisdata = $(this).attr('data-info');
        if ($('input[data-info=' + thisdata + ']').is(':checked')) {
            $("#pno" + thisdata).css("background-color", "Green");
        }
    });

//    $(document).bind("contextmenu", function (e) {
//        e.preventDefault();

//    });
    $("#ContentPlaceHolder1_btnsubmit").click(function () {
        $.blockUI();
    });

    $(window).unload(function () {
        $.cookie("unameName", null);
    });

//    $('input[type=button]').click(function () {
//        console.log("hgh");
//        thisdata = $(this).attr('data-info');
//        $("#pno" + thisdata).css("background-color", "#111");
//    });
//    $('.toc').click(function () {           
//       
//     $(this).css("background-color", "#008000");
//     });  
//         

</script>


</asp:Content>





$（文档）.ready（函数（）{
$（“#slider0”）.block（{消息：“欢迎！按下一步显示问题”，
css:{border:'3px solid#a00'}
});
});   
$（“.pagination”）。单击（函数（）{
$（“#滑块0”）.unblock（）；
});
$（“.pagination2”）。单击（函数（）{
$（“#滑块0”）.unblock（）；
});
featuredcontentslider.init({
id:“滑块0”，
contentsource:[“内联”，“内联”]，
toc:“增量”，
nextprev:[“上一个”，“下一个”]，
revealtype:“点击”，
enablefade:[正确，0.2]，
自动旋转：[true，3000]，
onChange：函数（previndex、curindex、contentdivs）{
}
})
featuredcontentslider1.init({
id:“滑块1”，
contentsource:[“内联”，“内联”]，
toc:“增量”，
nextprev:[“上一个”，“下一个”]，
revealtype:“点击”，
enablefade:[正确，0.2]，
自动旋转：[true，3000]，
onChange：函数（previndex、curindex、contentdivs）{
}
})
featuredcontentslider2.init({
id:“滑块2”，
contentsource:[“内联”，“内联”]，
toc:“增量”，
nextprev:[“上一个”，“下一个”]，
revealtype:“点击”，
enablefade:[正确，0.2]，
自动旋转：[true，3000]，
onChange：函数（previndex、curindex、contentdivs）{
}
})
featuredcontentslider3.init({
id:“滑块3”，
contentsource:[“内联”，“内联”]，
toc:“增量”，
nextprev:[“上一个”，“下一个”]，
revealtype:“点击”，
enablefade:[正确，0.2]，
自动旋转：[true，3000]，
onChange：函数（previndex、curindex、contentdivs）{
}
})
featuredcontentslider4.init({
id:“滑块4”，
contentsource:[“内联”，“内联”]，
toc:“增量”，
nextprev:[“上一个”，“下一个”]，
revealtype:“点击”，
enablefade:[正确，0.2]，
自动旋转：[true，3000]，
onChange：函数（previndex、curindex、contentdivs）{
}
})
$（'input[type=radio]'）。单击（函数（e）{
thisdata=$（this.attr（'data-info'）；
$（“#pno”+thisdata）.css（“背景色”、“绿色”）；
});
$（“.reset”）。单击（函数（）{
thisdata=$（this.attr（'data-info'）；
$（'input[data info='+thisdata+']'）.attr（'checked'，false）；
$（“#pno”+thisdata）.css（“背景色”、“红色”）；
});
$（“.Mark”）。单击（函数（）{
thisdata=$（this.attr（'data-info'）；
如果（$（'input[data info='+thisdata+']'）。是（':checked'））
{
$（“#pno”+thisdata）.css（“背景色”，“RGB（128,0128）”）；
}
});
$（“.Unmark”）。单击（函数（）{
thisdata=$（this.attr（'data-info'）；
如果（$（'input[data info='+thisdata+']'）。是（':checked'））{
$（“#pno”+thisdata）.css（“背景色”、“绿色”）；
}
});
//$（文档）.bind（“上下文菜单”，函数（e）{
//e.预防违约（）；
//    });
$（“#内容占位符1_btnsupmit”）。单击（函数（）{
$.blockUI（）；
});
$（窗口）。卸载（函数（）{
$.cookie（“unameName”，null）；
});
//$（'input[type=button]'）。单击（函数（）{
//控制台日志（“hgh”）；
//thisdata=$（this.attr（'data-info'）；
//$（“#pno”+thisdata）.css（“背景色”，“#111”）；
//    });
//$（'.toc'）。单击（函数（）{
//       
//$（this.css（“背景色”，“#008000”）；
//     });  
//

No的可能重复我不想阻止div，我只想阻止整个页面。当我点击按钮时，一个新窗口将打开（不在“新建”选项卡上），我想在加载时阻止新窗口的UI，并且新窗口的内容在div中不在div中它是一个新的HTML页面@mplungjan所以将它放在div中或在其上放置div！