Bootstrap点击事件(单击事件及双击事件)

Bootstrap点击事件

Bootstrap点击事件(单击事件及双击事件)_第1张图片

以上两种事件均可达到单击事件及双击事件的效果。下面我们分别举例说明:

jQuery事件 

//表格点击事件
    $('#getCqltj').on('dbl-click-row.bs.table', function (e, row, element) 
    {
        location.href = '../html/qykqsj.html?name='+escape(row.xm);
    });

 

Option事件

$('#getzxsjsz') .bootstrapTable( {
                url : '../ajaxjsp/zxsjsz_json.jsp?type=getzxsjsz', // 请求后台的URL(*)
                toolbar : '#toolbar', // 工具按钮用哪个容器
                striped : true, // 是否显示行间隔色
                cache : false, // 是否使用缓存,默认为true,所以一般情况下需要设置一下这个属性(*)
                pagination : false, // 是否显示分页(*)
                sortable : false, // 是否启用排序
                sortOrder : "asc", // 排序方式
                // queryParams : oTableInit.queryParams,// 传递参数(*)
                sidePagination : "client", // 分页方式:client客户端分页,server服务端分页(*)
                pageNumber : 1, // 初始化加载第一页,默认第一页
                pageSize : 10, // 每页的记录行数(*)
                pageList : [ 10, 25, 50, 100 ], // 可供选择的每页的行数(*)
                search : false, // 是否显示表格搜索,此搜索是客户端搜索,不会进服务端,所以,个人感觉意义不大
                strictSearch : true,
                showExport: true,   // 是否显示导出
                exportOptions : {
                    fileName : document.title
                },
                exportDataType: "all",              // basic', 'all',// 'selected'.
                showColumns : true, // 是否显示所有的列
                showRefresh : true, // 是否显示刷新按钮
                minimumCountColumns : 2, // 最少允许的列数
                clickToSelect : false, // 是否启用点击选中行
                height : '', // 行高,如果没有设置height属性,表格自动根据记录条数觉得表格高度
                uniqueId : "", // 每一行的唯一标识,一般为主键列
                showToggle : true, // 是否显示详细视图和列表视图的切换按钮
                cardView : false, // 是否显示详细视图
                detailView : false, // 是否显示父子表
                //fixedColumns : true,
                //fixedNumber : 1,//固定列数
                columns :     [{
                    field : 'sbsj',
                    title : '上班时间',
                    align: 'center'
                }, {
                    field : 'xbsj',
                    title : '下班时间',
                    align: 'center'
                }, {
                    field : 'wxkssj',
                    title : '午休开始时间',
                    align: 'center'
                }, {
                    field : 'wxjssj',
                    title : '午休结束时间',
                    align: 'center'
                }] ,
                  onClickCell: function(field, value, row, $element) {
                        $element.attr('contenteditable', true);
                        $element.blur(function() {
                            let index = $element.parent().data('index');
                            let tdValue = $element.html();
                            saveData(index, field, tdValue , row.zxlx);
                        })
                    }
            });

你可能感兴趣的:(js)