Load js and css file after Button click using jQuery

Last Reply one day ago By dharmendr

Posted 22 days ago


When users click on menu, mega menu will appear I want when users click to see mega menu when they click on menu it loads script and css of mega menu.

I mean I don't want loads megamenu when page is loading I want load it just when users click on menubar

I use below code for megamenu in page:

                                    <script src='<%=ResolveUrl("~/scripts/jquery.dcmegamenu.1.3.3.js" ) %>'></script>
                                    <link href="Css/dcmegamenu.css" rel="stylesheet" />

                                    <div class="demo-container1">
                                        <div class="red">
                                            <ul id="mega-menu-2" class="mega-menu1">
                                                <li><a href="#" id="mainsoft">&nbsp</a>
                                                        <li><a href="#">آموزهای کاربردی</a>
                                                            <div id="mega1A">
                                                                <asp:Repeater ID="RptkarbordA" runat="server">
                                                                        <li><a target="_blank">
                                                                            <asp:LinkButton ID="Linkbtnclass" runat="server" CommandArgument='<%# Eval("Secondclass") %>'
                                                                                OnClick="LinkbtnclassA_Click"><%# Eval("Secondclass") %></asp:LinkButton></a></li>

How I can do it?

best regards


You are viewing reply posted by: nedash 5 days ago.
Posted 5 days ago
dharmendr says:
Instead of calling on document ready you need to call only when required.


hi deharmendr

I change code like:

<script type="text/javascript">
        $(function () {
            $('#mega-menu').click(function () {
                $.getScript('https://cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.5.4/bootstrap-select.js', function (data, status, jqxhr) {

        $(document).ready(function ($) {

                rowItems: '7',
                speed: 'fast',
                effect: 'fade',
                event: 'click'

        function LoadCss(url) {
            var link = document.createElement("link");
            link.type = "text/css";
            link.rel = "stylesheet";
            link.href = url;
        function LoadScript(url) {
            var script = document.createElement('script');
            script.setAttribute('src', url);
            script.setAttribute('async', false);

but you told me:

Remove this code. As on document ready dcMegamenu is applied so it is displayed.





I agree, here is the link: https://www.e-iceblue.com/Introduce/spire-office-for-net-free.html