ajax请求数据时使用Jquery On绑定事件 案例：分页效果---切换事件

在使用ajax的回调函数中，往html页面添加内容，使用一般的方法绑定事件，是没用的，需要使用以下方法

$(“#pageNum”).on(‘click’,’#nextPage’,function(){})  //把点击事件绑定到id为pageNum的子级元素id为nextPage的元素身上

• 例如：做出分页效果

// html
 <ul id="pageNum">

 </ul>

// js部分（使用包装过的ajax）
// currentPage   当前在第几页
// pageTotal  总页数
function getPageTotal() {
        myAjax("get","/getPageTotal.do","",function () {
            let data=JSON.parse(xhr.responseText);
            let pageNum = [];
            for (var item = 1; item <= data; item++) {
                pageNum.push(" <li>");
                pageNum.push(" <a href=\"javascipt:;\">" + item + "</a>");
                pageNum.push(" </li>");
            }
            // 往html页面添加内容
            $("#pageNum").html(`<li id="prevPage"><a href="javascipt:;" aria-label="Previous"><span aria-hidden="true">«</span></a></li>`+
pageNum.join('') +`<li id="nextPage"><a href="javascipt:;" aria-label="Next"><span aria-hidden="true">»</span></a></li>
            <span>总共 <span id="totalPage"></span>页</span>`);
            console.log(data);
            pageTotal=data;
            document.getElementById("totalPage").innerHTML=currentPage+"/"+pageTotal;
        })
    }

//下一页
    $("#pageNum").on("click","#nextPage",function() {
        currentPage++;
        if(currentPage>pageTotal){
            showMsg("已经是最后一页了"); // 调用showMsg提示
            currentPage=pageTotal
        }else{
            renderTable(); // 加载页面数据
            document.getElementById("totalPage").innerHTML=currentPage+"/"+pageTotal;
        }
    });

// 上一页
    $("#pageNum").on("click","#prevPage",function() {
        currentPage--;
        console.log(currentPage);
        console.log(this);
        if(currentPage<=0){
            showMsg("已经是第一页了"); // 调用showMsg提示
            currentPage=1;
        }else{
            renderTable(); // 加载页面数据
            document.getElementById("totalPage").innerHTML=currentPage+"/"+pageTotal;
        }
    });