api - 在 Laravel Blade 的“Enter”上打开“Google Maps API 键盘快捷键”弹出窗口

问题描述

我已经使用同一个文件一年多了，突然在我的本地环境中，我的 Google Maps API 在按下回车键时不断打开一个“键盘快捷方式”弹出窗口。通常在按 Enter 时，我的光标会移动到表单中的下一个必填输入字段。我没有对我的代码进行任何更改，但我更新了 Sublime Text，我的文本编辑器，它现在似乎支持 .blade.php 文件。

我的 JavaScript 在更新后的样子：

我最终修复了代码，这是我目前的代码：

我的表格：客户地址搜索客户地址

            </x-slot>
            <div class="form-group row">
                <div class="col-lg-12">
                    <label>Physical Address<span style="color: red"> *</span></label>
                    <input type="search" id="searchmap" class="form-control" placeholder="Search Address..." name="address">
                    <input hidden type="text" name="lat" id="lat" required>
                    <input hidden type="text" name="lng" id="lng" required>
                    <br>
                    <div class="form-group">
                        <div id="map-canvas"></div>
                    </div>
                </div>
            </div>
            <!-- end::Row -->
            <div class="form-group row">
                <div class="col-md-12">
                    <label>Address Comments</label>
                    <textarea class="form-control" name="address_comments" id="address_comments" rows="3"></textarea>
                </div>
            </div>
        </x-card>

我的 JavaScript：

 <script src="https://maps.googleapis.com/maps/api/js?key=MYKEY&libraries=places" type="text/javascript"></script> 
        <script type="text/javascript">
            var map = new google.maps.Map(document.getElementById('map-canvas'),{
                  center:{
                    lat: -26.18,
                    lng: 28.04
                  },
                  zoom:9
                  }); 
                  
                var marker = new google.maps.Marker({
                  Position: {
                    lat: -26.18,
                    lng: 28.04
                  },
                  map: map,
                  draggable: true
                });
                var searchBox = new google.maps.places.SearchBox(document.getElementById('searchmap'));
                google.maps.event.addListener(searchBox,'places_changed',function(){
                  var places = searchBox.getPlaces();
                  var bounds = new google.maps.LatLngBounds();
                  var i, place;
                  for(i=0; place=places[i];i++){
                    bounds.extend(place.geometry.location);
                    marker.setPosition(place.geometry.location); //set marker position new...
                  }
                  map.fitBounds(bounds);
                  map.setZoom(18);
                  
                });
              google.maps.event.addListener(marker,'position_changed',function(){
                var lat = marker.getPosition().lat();
                var lng = marker.getPosition().lng();
                $('#lat').val(lat);
                $('#lng').val(lng);
              });
        </script>

弹出窗口：

标签： apiwindowmaps

api - 在 Laravel Blade 的“Enter”上打开“Google Maps API 键盘快捷键”弹出窗口

问题描述

解决方案

推荐阅读