如何使用ajax代码加载html页面

i use the following code to load the form as below code

as Ajax code as below

function assessment_form() {
    $this = $(this);
    $.ajax({
        url: 'view/assessment/assessment_form.php',
        datatype: 'html',
        success: function (data) {
            $box = $('.span12');
            $box.after(data);
            $box.remove();
        }
    });
}
$(document).on('click', '#assessment_form', $(this), assessment_form);

and the form page as below in directory view/assessment/assessment_form.php Add New User

<div class="box span12">
    <div class="box-header well" data-original-title>
            <h2> Add New User</h2>
    </div>
    <div class="box-content">
        <form class="form-horizontal" id="user_form_data" enctype="multipart/form-data">
            <fieldset>
                <div class="control-group">
                    <label class="control-label" for="firstname">ROTC NO</label>
                    <div class="controls">
                        <input class="input-xlarge focused" id="rotc_no" name="rotc_no" type="text" />
                    </div>
                </div>
                <div class="control-group">
                    <label class="control-label" for="lastname">Password</label>
                    <div class="controls">
                        <input class="input-xlarge focused" id="password" name="password" type="text" />
                    </div>
                </div>

Simply, You can load html page into a div by using jquery's load() function. Try this:

$('#yourDiv').load('pages/page1.html');

use this $(document).on('click','#assessment_form', assessment_form);

instead of $(document).on('click','#assessment_form',$(this),assessment_form);

Take a look for more information $.get()

// Make it little more flexible and easy
function assessment_form() {

    $.get('your_url', function(data){
        $box = $('.span12');
        $box.after(data);
        $box.remove();
    });
}