Ajax只能使用一次Codeigniter

Question

我有JS:

jQuery('.unblock').click(function(){
        var num = jQuery('.page.active').text();
        var ban_id = jQuery('.unblock').attr('id');

        jQuery.post('http://127.0.0.1/auth_system_1/user_activity/delete_user_ban', { ban_id : ban_id, num : num }, function(data) {

                if (data.status == 'ok')
                {
                    //jQuery('.comment-box').remove();
                    jQuery('#ban_list').append(data.html);
                }
                else
                {
                    alert('error');
                }

        }, 'json');
    });  

我的控制器:

function delete_user_ban()
{
    $user_id = $this->session->userdata('user_id');

    $ban_id = $this->input->post('ban_id');

    $current_page = (int)$this->input->post('num');

    $current_page = ($current_page-1)*2;

    //$this->activity_model->delete_user_ban($ban_id);

    $per_page = 2;

    $data['ban_list'] = $this->user_activity_lib->user_ban_list($user_id, $current_page, $per_page);

    $data['test'] = rand(1,100);

    $html = $this->load->view('front_end/ajax_delete_ban', $data, true);

    unset($data);
    unset($user_id);
    unset($ban_id);

    echo json_encode(array(
                            'status' => 'ok',
                            'html' => $html,
                            'start_page' => $current_page));

}

$data['test'] = rand(1,100); is for test! I make random number and send it to view.

我的问题是我在页面上有一些块,当我按下"unban"按钮记录删除数据库和json我返回加载的行(每页2项),当我尝试点击来自json的块上的相同按钮它不起作用？!为什么？

如果我按下来自json的物品,我的ajax不会拨打第二个电话吗？

来自json的视图与我在页面加载时加载的视图相同.

Answer 1

关键是jQuery的on()方法.

.on() - jQuery API

为什么？在加载DOM之后添加到网页的HTML元素将不会"看到"由例如.click(),或等声明的此类事件.hover().

jQuery('.unblock').on('click', function(){
    var num = jQuery('.page.active').text();
    var ban_id = jQuery('.unblock').attr('id');

    jQuery.post('http://127.0.0.1/auth_system_1/user_activity/delete_user_ban', { ban_id : ban_id, num : num }, function(data) {

            if (data.status == 'ok')
            {
                //jQuery('.comment-box').remove();
                jQuery('#ban_list').append(data.html);
            }
            else
            {
                alert('error');
            }

    }, 'json');
});

注意: jQuery的on()方法是在jQuery 1.7中引入的.如果您使用旧版本的jQuery,请使用该live()方法.

.live() - jQuery API