Input 以及 button 标签未能正常展示

首页课程实战体系课手记专栏慕课教程

来源：4-5 地图搜索与poi结合（2）

TKLook

2021-01-11 12:43:05

问题描述：

老师好，现在遇到的问题是：searchNode下面的Input标签和Button标签在页面不显示，麻烦老师帮忙看下

相关代码：

<!Doctype html>
<html>

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>地图搜索与POI结合</title>
    <script type="text/javascript"
        src="https://webapi.amap.com/maps?v=1.4.15&key=aa2dd8517ace29ac1eb05616ce5c9498&plugin=AMap.Autocomplete">

    </script>
    <style>
        * {
            margin: 0;
            padding: 0;
            list-style: none;
        }

        #container {
            width: 100%;
            height: 100%;
            position: absolute;
            left: 0;
            top: 0;
        }

        #setZoomNode,
        #setCenterNode {
            width: 280px;
            position: absolute;
            z-index: 99;
            right: 20px;
            top: 50px;
            border: 1px solid black;
            box-shadow: 0 0 5px black;
            background: white;
        }

        #setCenterNode {
            top: 50px;
        }

        #node li {
            cursor: pointer;
        }

        #searchNode {
            width: 280px;
            height: 30px;
            background: white;
            position: absolute;
            right: 20px;
            top: 20px;
        }
    </style>
</head>

<body>

    <div id="container">
        <div id="searchNode">
            <input id="searchIpt">
            <button id="btn">搜索</button>
        </div>

        <div id="setCenterNode">

        </div>

    </div>






    <script>
        var map = new AMap.Map('container', {

            zoom: 15,

            center: [116.396786, 39.909047]
        });


        AMap.service(['AMap.PlaceSearch'], function () {

            new AMap.PlaceSearch({
                pageSize: 3,
                pageIndex: 1,
                city: '010',
                citylimit: true,
                map: map, //展示在哪个地图里
                panel: 'setCenterNode' //放在哪个元素下
            }).search('电影院');

        });
    </script>
</body>

</html>