Question

我有这个代码用于显示和隐藏带复选框的标记，但我需要的是一个父标记，点击它应该显示的标记并隐藏多个子标记。就像当我点击地图上的主要分支时，它应该显示所有子分支。并且没有刷新页面我是新的抱歉如果我的问题不是Formated.please帮助我这个

<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="content-type" content="text/html; charset=UTF-8" />
    <title>Google Maps JavaScript API v3 Example: Marker Categories</title>
    <script type="text/javascript"
            src="http://maps.google.com/maps/api/js?sensor=false"></script>
    <script src="http://code.jquery.com/jquery-2.2.0.min.js"></script>
</head>
<body>
    <div id="map" style="width: 400px; height: 300px;"></div>

    <input type="checkbox" value="Show Group 1" onclick="displayMarkers(this,1);">
    <input type="checkbox" value="Show Group 2" onclick="displayMarkers(this, 2);">

    <script type="text/javascript">
        var beaches = [
            ['Bondi Beach', -33.890542, 151.274856, 1,],
            ['Coogee Beach', -33.923036, 151.259052, 1],
            ['Cronulla Beach', -34.028249, 151.157507, 1],
            ['Manly Beach', -33.800101, 151.287478, 2],
            ['Maroubra Beach', -33.950198, 151.259302, 2]
        ];

        var map = new google.maps.Map(document.getElementById('map'), {
            zoom: 10,
            center: new google.maps.LatLng(-33.88, 151.28),
            mapTypeId: google.maps.MapTypeId.ROADMAP
        });

        var markers = [];
        var i, newMarker;

        for (i = 0; i < beaches.length; i++) {
            newMarker = new google.maps.Marker({
                position: new google.maps.LatLng(beaches[i][1], beaches[i][2]),
                map: map,
                title: beaches[i][0]
            });

            newMarker.category = beaches[i][3];
            newMarker.setVisible(false);
            markers.push(newMarker);
        }
        function displayMarkers(obj, category) {
            var i;

            for (i = 0; i < markers.length; i++) {
                if (markers[i].category === category) {
                    if ($(obj).is(":checked")) {

                        markers[i].setVisible(true);
                    } else {
                        markers[i].setVisible(false);
                    }
                }
                else {
                    markers[i].setVisible(false);
                }
            }
        }
    </script>
</body>
</html>

Answer 1

将相同的类提供给父级和子级，单击Marker时可以显示父级和子级..

以下是示例：

$(".classname).show();
$(".classname).hide();

单击父标记时显示和隐藏多个标记

1 个答案: