bootstraptable默認選中第一條數據，且支持鍵盤上下切換數據，左右翻頁

1、checkboxCarppFormatter函數

<table id="carpassTable" data-pagination="true"  data-height="588" 
	data-side-pagination="server" 
	data-page-size="10" data-mobile-responsive="true"
	data-striped="true" data-page-list="[10, 15, 25, 50]">
	<thead>
		<tr>
			<th data-checkbox="true" data-formatter="checkboxCarppFormatter"
				data-align="center"></th>
			<th data-field="id" data-visible="false" data-align="center">ID</th>
			<th data-field="PlateNo" data-align="center">車牌號</th>
			<th data-field="Pictures" data-align="center" data-formatter="imgPictureesFormatter">車牌圖片</th>
			<th data-field="TollgateName" data-formatter="tollgateNameFormatter"
			 data-align="center">卡口名稱</th>
			<th data-field="LaneNo" data-align="center">車道</th>
			<th data-field="PlateColor" data-align="center"
				data-formatter="plateColorFormatter">號牌顏色</th>
			<!-- PlateColorType -->
			<th data-field="VehicleColor" data-align="center"
				data-formatter="vehicleColorFormatter">車身顏色</th>
			<th data-field="IllegalCode" data-align="center"
				data-formatter="illegalCodeTypeFormatter">類型</th>
			<th data-field="PassTime"  data-align="center" >過車時間</th>
			<th data-align="center" data-formatter="operateFormatter" data-events="operateEvents">操作</th>
		</tr>
	</thead>
</table>

　　

/**
 * 默認選中第一條數據
 */

function checkboxCarppFormatter(row, value, index){
	if(index==0){
		$("#images").attr("src", "");
		$('#zoom1').attr('href',"");
		assignment();
		$("#showPicUlId").children("li").remove();
		//獲取選中的數據
		$("#images").attr("src", "img/timg1.gif");
		$('#zoom1').attr('href',"img/timg1.gif");
		onSelectedRowChanged(value);
                carArr = [];
		carArr.push(value);
                if(carArr.length>0){
			$("#imgUpload").removeAttr("disabled");
		}else{
			$("#imgUpload").attr('disabled',true); 
		}
		return {
                     checked : true//設置選中
                };
	}
	return value;
}        

　　2、引入鍵盤事件

$(document).keydown(function(event){
	//console.log("===="+event.keyCode);
	// 兼容FF和IE和Opera  
    var theEvent = event || window.event;  
    var code = theEvent.keyCode || theEvent.which || theEvent.charCode;  
    console.log("keyCode:"+code);
    switch(code){
		case 37: //左
			key37("prevPage");
		break; 
		case 38: //上
			key38("upper");
		break;
		case 39:  //右
			key39("nextPage");
		break;	
		case 40:  //下
			key40("lower");
		break;
		case 13: //回車
			key13();
		break;
		case 27: //exc
			key27();
		break;
	}
    return true; 
});

　　3、執行鍵盤操作事件

function key37(type){
	keyboardPaging("prevPage");
};

function key38(type){
	keyboardCheck("upper");
};

function key39(type){
	keyboardPaging("nextPage");
};

function key40(type){
	keyboardCheck("lower");
};

function key13(){
	keyEnter();
};


/**
 * 鍵盤選擇數據 
 * @param type upper上 lower 下
 * @returns 
 */
function keyboardCheck(type){
	var arrselections = $("#carpassTable").bootstrapTable('getSelections');
	var data = $("#carpassTable").bootstrapTable('getData');
	if(arrselections.length==1){
		for(var j = 0; j < data.length; j++){
			if(data[j].Id == arrselections[0].Id){
				if(type=="upper"){
					if(j>0){
						$("#images").attr("src", "img/timg1.gif");
						$('#zoom1').attr('href',"img/timg1.gif");
						$("#carpassTable").bootstrapTable('uncheckBy', {field: 'Id', values: [arrselections[0].Id]})
						$("#carpassTable").bootstrapTable('checkBy', {field: 'Id', values: [data[j-1].Id]})
						onSelectedRowChanged(data[j-1]);
					}else{
						break;
					}
				}else{
					if(j<data.length-1){
						$("#images").attr("src", "img/timg1.gif");
						$('#zoom1').attr('href',"img/timg1.gif");
						$("#carpassTable").bootstrapTable('uncheckBy', {field: 'Id', values: [arrselections[0].Id]})
						$("#carpassTable").bootstrapTable('checkBy', {field: 'Id', values: [data[j+1].Id]})
						onSelectedRowChanged(data[j+1]);
					}else{
						break;
					}
				}
				
				carArr = [];
	            $("input[name='btSelectItem']:checkbox").each(function(i){
	            	if(this.checked){
	            		carArr.push(arrselections[0]);
	            	}
	            });
	            if(carArr.length>0){
					$("#imgUpload").removeAttr("disabled");
				}else{
					$("#imgUpload").attr('disabled',true); 
				}
				break;
			}
		}
	}else{
		console.log("大於1或者空均不用使用鍵盤移動");
	}
}


/**
 * 回車查看詳情
 * @returns
 */
function keyEnter(){
	var arrselections = $("#carpassTable").bootstrapTable('getSelections');
	if(arrselections.length==1){
		media(arrselections[0]);
	}else{
		console.log("大於或者小於1無法回車查看詳情")
	}
	
}

/**
 * 鍵盤分頁
 * @param type prevPage  nextPage
 * @returns
 */
function keyboardPaging(type){
	$("#carpassTable").bootstrapTable(type);
}