如何从谷歌地图 div 跳过 tabIndex 并使用 angular8 从一个输入移动到另一个输入

Question

我有 2 个输入字段以及 Map div，这里当我切换时，选项卡焦点将从第一个输入字段转到地图内的名称和链接，在传递到所有地图名称后，它到达第二个输入字段。我尝试在地图函数内将 tabindex 设置为 -1，但没有任何效果。任何人都可以帮助我，如何使这项工作有效。TS： var map = new window["google"].maps.Map(this.gmapElement.nativeElement, {        center: { lat: 37.1587963, lng: -100.5623315 },        zoom: 2      });      google.maps.event.addListener(map, "titlesLoaded", function() {        [].slice.apply(this.gmapElement.nativeElement).forEach(function(item) {          item.setAttribute("tabindex", "-1");        });HTML： <div class="col" >            <a href="javascript:void(0);" tabindex="-1">View on Map</a>            <div  style="position: relative; overflow: hidden;width:100%;height:400px" #mapRef>            </div>演示版

Answer 1

正如我在评论中所说，您只需在 2 个输入上添加tabindex="1"和即可。tabindex="2"

工作代码片段：

var map;

function initialize() {

  // Create the map and center on deault location

  map = new google.maps.Map(document.getElementById('map'), {

    center: new google.maps.LatLng(0, 0),

    zoom: 3

  });

}

#map {

  height: 120px;

  width: 100%

}

<input type="text" tabindex="1">

<div id="map"></div>

<input type="text" tabindex="2">

<!-- Replace the value of the key parameter with your own API key. -->

<script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyCkUOdZ5y7hMm0yrcCQoCvLwzdM6M8s5qk&callback=initialize" async defer></script>