Question

我创建了一个包含ALK卡的网页，一切正常，但问题是我不能使用＆＃39; +＆＃39;和＆＃39; - ＆＃39;字符或页面文本字段上的方向箭头，这些字符在地图上起作用。

我在alk网站上发现了同样的问题：

http://maps.alk.com/Examples/GeocodingResults

这是html / javascript代码：

感谢您的支持！

<!DOCTYPE html>
<html>
    <head>
        <title>ALK Maps Examples - Geocoding Results</title>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=Edge" />
        <meta name="viewport" content="width=device-width, initial-scale=1.0,       maximum-scale=1.0, user-scalable=0">

        <link href="/Content/example.styles.min.css" rel="stylesheet" />

        <script src="//maps.alk.com/api/1.2/alkmaps.js" type="text/javascript"></script>

        <script type="text/javascript">
            var map, markerLayer;
            function init() {
                ALKMaps.APIKey = "17CA0885B03A6B4FADBDC3D1A51DC0BD";//You  will need to replace this with your own API key
                map = new ALKMaps.Map("map");
                var layer = new ALKMaps.Layer.BaseMap("ALK Maps", {}, {  displayInLayerSwitcher: false });
                markerLayer = new ALKMaps.Layer.Markers("Markers");
                map.addLayers([layer, markerLayer]);

                var center = new ALKMaps.LonLat(-75.7, 40.9).transform(new ALKMaps.Projection("EPSG:4326"), map.getProjectionObject()); //transform to mercator
                map.setCenter(center, 7);

            }

            function geocode() {
                var address = document.getElementById('geoStreet').value;
                var city = document.getElementById('geoCity').value;
                var state = document.getElementById('geoState').value;
                var zip = document.getElementById('geoZip').value;

                var params = {
                    address:
                        {
                            addr: address,
                            city: city,
                            state: state,
                            zip: zip
                        },
                    listSize: 100,
                    async: true,
                    success: function (response) {
                        var marker, icon, lon, lat, address;
                        var display = "";
                        for (var i = 0; i < response.length; i++) {
                            lon = response[i].Coords.Lon;
                            lat = response[i].Coords.Lat;
                            address = response[i].Address.StreetAddress;
                            icon = new ALKMaps.Icon(ALKMaps.IMAGE.FAVORITE, new ALKMaps.Size(30, 30));
                            marker = new ALKMaps.Marker(
                                new ALKMaps.LonLat(lon, lat),
                                icon,
                                address,
                                { mouseOver: true, labelOffset: "0px", map:  map }
                            );
                            markerLayer.clearMarkers();
                            markerLayer.addMarker(marker);


                            var obj = response[i];
                            for (field in obj) {
                                if (field === "Errors") {
                                    for (var j = 0; j < obj[field].length; j++) {
                                        var error = obj[field][i];
                                        for (errField in error) {
                                            display = display + errField + ": " + error[errField] + ",";
                                        }
                                    }
                                } else {
                                    var obj2 = obj[field];
                                    for (key in obj2) {
                                        display = display + obj2[key] + ", ";
                                    }
                                }
                            }
                            display = display + "\n\n";
                        }
                        document.getElementById('geoResults').innerHTML = display;
                    }

                };
                map.geocode(params);
            }
        </script>


    </head>
    <body onload="init()">
        <div id="example-container">

            <h1>Geocoding Results</h1>

            <p>
                This example demonstrates the use of the geocoding results list. After filling out the form below the map and clicking on the search button, a marker will be placed on the latitude and longitude obtained from the results and the entire results list is displayed in the text area at the bottom of the page.
            </p>

            <div id="map" style="width: 850px; height: 550px"></div>


            <div class="bottom-panel">
            <div>
                <label class="input">
                    <span>Street Address</span>
                        <input class="form-control" id='geoStreet' type='text' />
                </label>
            </div>
            <div>
                <label class="input">
                    <span>City</span>
                    <input class="form-control" id='geoCity' type='text' />
                </label>
            </div>
            <div>
                <label class="input">
                    <span>State</span>
                    <input class="form-control auto-width" id='geoState' type='text' size='2' />
                </label>
                <label class="input">
                    <span>Zip</span>
                    <input class="form-control auto-width" id='geoZip' type='text' size='5' />
                </label>
                <input class="btn btn-sm btn-primary" id="geoButton" type="submit" value="Search" onclick="geocode()" />
            </div>
            <textarea id="geoResults" style="width: 500px; height: 150px;">     </textarea>
        </div>


    </div>



</body>
</html>

Answer 1

我找到了解决方案，我想分享一下。

[5,6]

键盘键不可操作

1 个答案: