Codeigniter Ajax分页链接在画布外触发打开

在下面的ajax上，我生成了两个分页结果

当我出于某种原因单击分页链接时，它会触发我的离开画布菜单打开

问题：我如何确保只有在单击该类时 .navbar品牌将打开画布

$（文档）.ready（函数（）{
变量menuToggle=$（'navbar brand'）；
var menuToggleIcon=menuToggle.find（'.fa'）；
var offCanvas=$（“.offCanvas”）；
变量内容=$（'.content'）；
菜单切换。单击（函数（）{
关闭菜单（菜单切换、关闭画布）；
});
内容。单击（函数（）{
关闭菜单（菜单切换、关闭画布）；
});
功能关闭菜单（菜单切换、关闭画布）{
menuToggleIcon.toggleClass（'fa-indent fa outdent'）；
offCanvas.toggleClass（“打开”）；
}
}); 
$（文档）.ready（函数（）{
功能加载问题数据（第页）{
$.ajax({
url:“仪表板/问题分页/”+页面，
方法：“获取”，
数据类型：“json”，
成功：功能（数据）{
$（'questions_table'）.html（data.questions_table）；
$（'question#pagination_link'）.html（data.pagination1_link）；
}
});
}
加载问题数据（1）；
$（文件）。在“点击”上。问题a页，功能（事件）{
event.preventDefault（）；
var page=$（this）.data（“ci分页页”）；
加载问题数据（第页）；
});
});
$（文档）.ready（函数（）{
功能加载\用户\数据（第页）{
$.ajax({
url:“仪表板/用户分页/”+页面，
方法：“获取”，
数据类型：“json”，
成功：功能（数据）{
$（'#users_table'）.html（data.users_table）；
$（'#user_pagination_link'）.html（data.pagination2_link）；
}
});
}
加载用户数据（1）；
$（文档）.on（“单击”，“.user pag li a”，函数（事件）{
event.preventDefault（）；
var page=$（this）.data（“ci分页页”）；
加载用户数据（第页）；
});
});

控制器

<?php

class Dashboard extends MY_Controller {

    public $data = array();

    public function __construct() {
        parent::__construct();
        $this->load->model('user/user_model');
        $this->load->model('forum/question_model');
        $this->load->library('pagination');
    }

    public function index() {       
        $this->data['title'] = 'Dashboard';
        $this->data['is_logged'] = $this->session->userdata('is_logged');

        $this->data['navbar'] = $this->load->view('common/navbar', $this->data, TRUE);

        $this->load->view('common/header', $this->data);
        $this->load->view('common/dashboard', $this->data);
        $this->load->view('common/footer', $this->data);
    }

    public function users_pagination() {
        $config = array();
        $config["base_url"] = "#";
        $config["total_rows"] = $this->user_model->total_users();
        $config["per_page"] = 2;
        $config["uri_segment"] = 3;
        $config["use_page_numbers"] = TRUE;
        $config["num_links"] = 1;

        $config["full_tag_open"] = '<ul class="pagination user-pag">';
        $config["full_tag_close"] = '</ul>';
        $config["first_tag_open"] = '<li>';
        $config["first_tag_close"] = '</li>';
        $config["last_tag_open"] = '<li>';
        $config["last_tag_close"] = '</li>';
        $config['next_link'] = '&gt;';
        $config["next_tag_open"] = '<li>';
        $config["next_tag_close"] = '</li>';
        $config["prev_link"] = "&lt;";
        $config["prev_tag_open"] = "<li>";
        $config["prev_tag_close"] = "</li>";
        $config["cur_tag_open"] = "<li class='active'><a href='#'>";
        $config["cur_tag_close"] = "</a></li>";
        $config["num_tag_open"] = "<li>";
        $config["num_tag_close"] = "</li>";

        $this->pagination->initialize($config);
        $page = $this->uri->segment(3);

        $start = ($page - 1) * $config["per_page"];

        $output = array(
           'pagination2_link'  => $this->pagination->create_links(),
           'users_table'   => $this->user_model->get_ajax_users($config["per_page"], $start)
        );

        echo json_encode($output);
    }

    public function questions_pagination() {
        $config = array();
        $config["base_url"] = "#";
        $config["total_rows"] = $this->question_model->total_questions();
        $config["per_page"] = 2;
        $config["uri_segment"] = 3;
        $config["use_page_numbers"] = TRUE;
        $config["num_links"] = 1;

        $config["full_tag_open"] = '<ul class="pagination question-pag">';
        $config["full_tag_close"] = '</ul>';
        $config["first_tag_open"] = '<li>';
        $config["first_tag_close"] = '</li>';
        $config["last_tag_open"] = '<li>';
        $config["last_tag_close"] = '</li>';
        $config['next_link'] = '&gt;';
        $config["next_tag_open"] = '<li>';
        $config["next_tag_close"] = '</li>';
        $config["prev_link"] = "&lt;";
        $config["prev_tag_open"] = "<li>";
        $config["prev_tag_close"] = "</li>";
        $config["cur_tag_open"] = "<li class='active'><a href='#'>";
        $config["cur_tag_close"] = "</a></li>";
        $config["num_tag_open"] = "<li>";
        $config["num_tag_close"] = "</li>";

        $this->pagination->initialize($config);
        $page = $this->uri->segment(3);

        $start = ($page - 1) * $config["per_page"];

        $output = array(
           'pagination1_link'  => $this->pagination->create_links(),
           'questions_table'   => $this->question_model->get_ajax_questions($config["per_page"], $start)
        );

        echo json_encode($output);
    }
}

单击分页链接时需要使用

$(document).on("click", ".question-pag li a", function(event){
    event.preventDefault();
    event.stopPropagation(); // it will prevent your content click function
    var page = $(this).data("ci-pagination-page");
    load_questions_data(page);
});

而且，对于用户数据

$(document).on("click", ".user-pag li a", function(event){
    event.preventDefault();
    event.stopPropagation(); // it will prevent your content click function
    var page = $(this).data("ci-pagination-page");
    load_users_data(page);
});

感谢您提供带有分页链接部分的答案

我已经解决了问题主要问题在画布外脚本中

新代码

<script type="text/javascript">
$(document).ready(function() {

var menuToggleIcon = $('.navbar-brand').find('.fa');

$('.navbar-brand').on('click', function() {
    menuToggleIcon.toggleClass('fa-indent fa-outdent');
    $('.offcanvas').toggleClass('open');
});

}); 

</script>


$（文档）.ready（函数（）{
var menutogleicon=$（'.navbar brand'）.find（'.fa'）；
$（'navbar brand'）。在（'click'，function（）上{
menuToggleIcon.toggleClass（'fa-indent fa outdent'）；
$（'.offcanvas'）.toggleClass（'open'）；
});
}); 

旧书

<script type="text/javascript">
$(document).ready(function() {
var menuToggle = $('.navbar-brand');
var menuToggleIcon = menuToggle.find('.fa');
var offCanvas = $('.offcanvas');
var content = $('.content');

menuToggle.click(function() {
     closeMenu(menuToggleIcon, offCanvas);
});

content.click(function() {
    closeMenu(menuToggleIcon, offCanvas);
});

function closeMenu(menuToggleIcon, offCanvas) {
    menuToggleIcon.toggleClass('fa-indent fa-outdent');
    offCanvas.toggleClass('open');
}

}); 
</script>


$（文档）.ready（函数（）{
变量menuToggle=$（'navbar brand'）；
var menuToggleIcon=menuToggle.find（'.fa'）；
var offCanvas=$（“.offCanvas”）；
变量内容=$（'.content'）；
菜单切换。单击（函数（）{
关闭菜单（菜单切换、关闭画布）；
});
内容。单击（函数（）{
关闭菜单（菜单切换、关闭画布）；
});
功能关闭菜单（菜单切换、关闭画布）{
menuToggleIcon.toggleClass（'fa-indent fa outdent'）；
offCanvas.toggleClass（“打开”）；
}
}); 
您在
$（'.content'）中的分页链接
？@RohanKumar yesTried它仍然打开画布您需要为
$（文档）添加相同的链接。在（“单击“，”.user pag li a”，函数（事件）{
。查看我的更新答案我仍然会根据我的视图打开画布外的侧栏，但它不应切换。但是您可以使用
e.target
像
内容一样检查导致此问题的元素。单击（函数（e）{console.log（e.target）。
<script type="text/javascript">
$(document).ready(function() {

var menuToggleIcon = $('.navbar-brand').find('.fa');

$('.navbar-brand').on('click', function() {
    menuToggleIcon.toggleClass('fa-indent fa-outdent');
    $('.offcanvas').toggleClass('open');
});

}); 

</script>

<script type="text/javascript">
$(document).ready(function() {
var menuToggle = $('.navbar-brand');
var menuToggleIcon = menuToggle.find('.fa');
var offCanvas = $('.offcanvas');
var content = $('.content');

menuToggle.click(function() {
     closeMenu(menuToggleIcon, offCanvas);
});

content.click(function() {
    closeMenu(menuToggleIcon, offCanvas);
});

function closeMenu(menuToggleIcon, offCanvas) {
    menuToggleIcon.toggleClass('fa-indent fa-outdent');
    offCanvas.toggleClass('open');
}

}); 
</script>