jQuery onclick自动加载1 div [关闭]

In this jQuery script, When I CLICK add customer link (in image 1) its load add customer form (in image 2) .How do I change this script to load automatically add customer form when I visited the page.Please help me thank you in advance .


Screenshot


Code:

<?php  $this->load->view('template/admin_header.php'); ?><!-- load admin header  -->
    <!-- Script for add user box show Start  -->
    <script type='text/javascript'>//<![CDATA[
        $(function () {
            $(function () {
                $('.load').on('click', function () {
                    var ID = $(this).attr('id');
                    $('.div').hide('fast');
                    $('.' + ID).show('fast');
                });
            });
        });//]]>
    </script>
    <!-- Script for add user box show END -->
    <div class="grid">
        <div class="row">
            <?php  $this->load->view('admin/admin_topmenu.php'); ?>
        </div>
        <div class="row">
            <?php  echo form_open('admin/add_users_data')  ?><!-- start of the form -->
            <div class="span8">
                <div style="padding-bottom:11px;">
                    <div class="div add_cus box"><!-- start of the add customer add form -->
                        <feildset>
                            <legend><i class="icon-user-2 on-right on-left"></i><strong>Add Customer</strong></legend>
                            <h6>*All fields marked are required</h6>
                            <lable>Name*</lable>
                            <div class="input-control text" data-role="input-control">
                                <input type="text" name="cus_name" placeholder="type your name">
                                <button class="btn-clear" tabindex="-1"></button>
                            </div>
                            <lable>Email*</lable>
                            <div class="input-control text" data-role="input-control">
                                <input type="text" name="cus_email" placeholder="type your email">
                                <button class="btn-clear" tabindex="-1"></button>
                            </div>
                            <lable>Phone*</lable>
                            <div class="input-control text" data-role="input-control">
                                <input type="text" name="cus_phone" placeholder="type your phone number">
                                <button class="btn-clear" tabindex="-1"></button>
                            </div>
                            <lable>Mobile (for Alerts)</lable>
                            <div class="input-control text" data-role="input-control">
                                <input type="text" name="cus_mobile" placeholder="type your mobile number">
                                <button class="btn-clear" tabindex="-1"></button>
                            </div>
                            <lable>Password*</lable>
                            <div class="input-control text" data-role="input-control">
                                <input type="password" name="cus_password" placeholder="Enter Your password">
                                <button class="btn-clear" tabindex="-1"></button>
                            </div>
                            <lable>Retype Password*</lable>
                            <div class="input-control text" data-role="input-control">
                                <input type="password" name="cus_passconf" placeholder="Enter Your password again">
                                <button class="btn-clear" tabindex="-1"></button>
                            </div>
                            <input name='cus_status' type='hidden' value='disabled'/>
                            <input type="submit" value="Add Customer" class="info">
                        </feildset>
                    </div><!-- END of the add customer add form -->
                </div>
                <div class="div add_oper">
                    RadioButton 2 Selected
                </div>
                <div class="div add_admin">
                    RadioButton 3 Selected
                </div>
            </div>
            <?php  echo form_close(); ?><!-- END of the form -->
            <div class="span2">
                <!-- start of side bar sub -->
                <p><a href="#" id="add_cus" class="load item-title-secondary"><i class="icon-plus on-right on-left"></i>Add
                        Customer</a></p>
                <p><a href="#" id="add_oper" class="load item-title-secondary"><i
                            class="icon-plus on-right on-left"></i>Add Operator</a></p>
                <p><a href="#" id="add_admin" class="load item-title-secondary"><i
                            class="icon-plus on-right on-left"></i>Add Admin</a></p>
                <!-- END of side bar sub -->
            </div>
            <div class="span3">
                <!-- start of side bar main -->
                <nav class="sidebar dark">
                    <ul>
                        <li>
                            <a href="<?php  echo site_url('admin/add_users')  ?>">
                                <i class="icon-plus-2"></i>
                                Add Users
                            </a>
                        </li>
                        <li>
                            <a href="<?php  echo site_url('admin/manage_customer')  ?>">
                                <i class="icon-user-2"></i>
                                Manage Customers
                            </a>
                        </li>
                        <li>
                            <a href="#">
                                <i class="icon-user"></i>
                                Manage Operators
                            </a>
                        </li>
                        <li>
                            <a href="#">
                                <i class="icon-user-3"></i>
                                Manage Admins
                            </a>
                        </li>
                    </ul>
                </nav>
                <!-- END of side bar main -->
            </div>
        </div>
    </div>
<?php  $this->load->view('template/admin_footer.php'); ?><!-- load admin footer  -->

First of all, You need not use dom ready jquery event twice.

 <script type='text/javascript'>//<![CDATA[
        $(function () {
            $(function () {
                $('.load').on('click', function () {
                    var ID = $(this).attr('id');
                    $('.div').hide('fast');
                    $('.' + ID).show('fast');
                });
            });
        });//]]>
    </script>

It can be just

<script type='text/javascript'>//<![CDATA[
        $(function () {
                $('.load').on('click', function () {
                    var ID = $(this).attr('id');
                    $('.div').hide('fast');
                    $('.' + ID).show('fast');
                });
        });//]]>
    </script>

Now for your question, If you want to load the add customer form on page load itself, You can achieve it by two ways.

  1. Trigger the click event on page load. Add this line below your click handler

                $('.load').click();
    
  2. on page load, show the add_cus div. Add this line below your click handler

                $('.add_cus').show('fast');
    

Hope its useful to you.