我在页面上有一个简单的灯箱,其中关闭图标有一些类<!DOCTYPE html>
<html>
<head>
<script src="http://maps.googleapis.com/maps/api/js"></script>
<script>
function initialize(){
var latitude;
var longitude;
var latDest;
var longitudeDest;
var mapProp = {
center: new google.maps.LatLng(52.395715,4.888916),
zoom: 5,
mapTypeId: google.maps.MapTypeId.ROADMAP
};
var map = new google.maps.Map(document.getElementById("googleMap"), mapProp);
document.getElementById('submit').addEventListener('click', function() {
latitude = document.getElementById('latitude').value;
longitude = document.getElementById('longitude').value;
latDest = document.getElementById('latDest').value;
longitudeDest = document.getElementById('longitudeDest').value;
});
var start = new google.maps.LatLng(latitude,logitude);
var dest = new google.maps.LatLng(latDest,longitudeDest);
var myTrip=[start,dest]
var flightPath=new google.maps.Polyline({
path:myTrip,
strokeColor:"#0000FF",
strokeOpacity:0.8,
strokeWeight:2
});
flightPath.setMap(map);
}
}
google.maps.event.addDomListener(window, 'load', initialize)
</script>
</head>
<body>
<div id="googleMap" style="width:500px;height:380px;"></div>
<form>
<label>Start Lattitude</label><input type = "text" name = "latitude"/> <br>
<label>Start Longitude</label><input type = "text" name = "longitude"/><br>
<label>Destination Latitude</label><input type = "text" name = "latDest"/><br>
<label>Destination Longitude</label><input type = "text" name = "longitudeDest"/><br>
<input type = "submit" name = "submit">
</form>
</body>
</html>
。当用户单击关闭图标时,我想将焦点移回链接元素,这会触发灯箱。
我尝试添加一些函数,该函数接受触发链接和结束图标类名称的输入。
.closeIt
对于每个灯箱,我手动调用该函数,如下所示:
function focusBack(triggeringLinkId,closingLinkClass){
$(closingLinkClass).click(function () {
$(triggeringLinkId).focus();
});
}
如果我在页面上只有一个灯箱,这种方法可以正常工作,但如果我有多个灯箱,它会开始将它绑定到最后一个被调用的函数,现在无论我关闭什么灯箱,焦点都会回到触发状态我上次称为 focusBack('#someLink','.closeIt')
函数的链接。
处理这种情况的最佳方法是什么?
答案 0 :(得分:0)
我已经用这个方法解决了这个问题:
function focusBack(triggeringLinkId,closingLinkClass){
$(triggeringLinkId).click(e){
$(e.target).addClass('triggeringLinkClass');
}
$(closingLinkClass).click(function () {
$(triggeringLinkClass).focus();
$(triggeringLinkClass).removeClass('triggeringLinkClass');
});
}
我不认为这是最好的方法,但它解决了我的问题。