jquery-seat-charts 使用(去除第一个元素获取焦点)

问题:每次点击空白处,第一个座位元素就会获取焦点并变色

解决: 注释掉获取焦点方法(如下),找到源码大概在474行左右

	fn.focus(function() {
			if (fn.attr('aria-activedescendant')) {
				seats[fn.attr('aria-activedescendant')].blur();
			}
			fn.find('.seatCharts-seat:not(.seatCharts-space):first').focus();
//			seats[seatIds[0]].focus();
		});

关于单选问题(即一次只能选择一个元素):

function initRooms(){
	var price = 100; //房间价
	var beforeroom;
	var $cart = $('#rooms_selected'), //房间区
	$rooms_num = $('#rooms_num'), //房间数
	$total_price = $('#rooms_price'); //总金额
	$roomNo = $('#roomNo');//房间号
	$roomMsg = $('#roomMsg');//房间信息
	
	var sc = $('#room_area').seatCharts({
		map: [//房间结构图 f 代表已入住;e 代表未入住; 下划线 "_" 代表过道
//			'fffffffffffffffffffffffffffff',
			'eeeeeeeeeeeeeeffffffffff',
			'ffeeeeeefeeeeeffffffffff'
		],
		seats: {//设置已入住和未入住相关属性
			f: {
				price: 125,
				classes: 'first-class',
				category: '已入住'
			},
			e: {
				price: 70,
				classes: 'economy-class',
				category: '未入住'
			}
		},
		naming: {//设置行列等信息
			top: false, //不显示顶部横坐标(行) 
			rows: ['2', '1'],
			getLabel: function(character, row, column) { //返回房间信息 
				return column;
			}
		},
		click: function() {
			if (this.status() == 'available') { //若为可选状态,添加响应事件
				var selectedbox = $('#room_area').find('.selected');
				if(!isEmpty(selectedbox)){
					selectedbox.click();
				}
				
				var msgHtml = '<table>'+
								'<tr>'+
						            '<th align="left"><image src="/CERPGIS/gis/images/indexlgd/water.png"/><span>水表</span></th>'+
									'<th align="left"><image src="/CERPGIS/gis/images/indexlgd/electric.png"/><span>电表</span></th>'+
									'<th align="left"><image src="/CERPGIS/gis/images/indexlgd/heat.png"/><span>热量表</span></th>'+
									'<th align="left"><image src="/CERPGIS/gis/images/indexlgd/valve.png"/><span>温控阀</span></th>'+
								'</tr>'+
								'<tr>'+
									'<td><lable>水表流量:</lable><font>130Kg</font></td>'+
									'<td><lable>电表电压:</lable><font>145V</font></td>'+
									'<td><lable>热量表温度:</lable><font>130°C</font></td>'+
									'<td><lable>温控阀状态:</lable><font>开启</font></td>'+
							    '</tr>'+
								'<tr>'+
									'<td><lable>水表流量:</lable><font>130Kg</font></td>'+
									'<td><lable>电表电压:</lable><font>145V</font></td>'+
									'<td><lable>热量表温度:</lable><font>130°C</font></td>'+
									'<td><lable>温控阀状态:</lable><font>开启</font></td>'+
							    '</tr>'+
								'<tr>'+
									'<td><lable>水表流量:</lable><font>130Kg</font></td>'+
									'<td><lable>电表电压:</lable><font>145V</font></td>'+
									'<td><lable>热量表温度:</lable><font>130°C</font></td>'+
									'<td><lable>温控阀状态:</lable><font>开启</font></td>'+
							    '</tr>'+
								'<tr>'+
									'<td><lable>水表流量:</lable><font>130Kg</font></td>'+
									'<td><lable>电表电压:</lable><font>145V</font></td>'+
									'<td><lable>热量表温度:</lable><font>130°C</font></td>'+
									'<td><lable>温控阀状态:</lable><font>开启</font></td>'+
							    '</tr>'+
							'</table>';
				$roomMsg.html(msgHtml);
				return 'selected';
			} else if (this.status() == 'selected') { //若为选中状态
				return 'available';
			}
		}
	});	
}


评论 4
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

淘淘 小窝

为嗷嗷待哺的我助力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值