谷歌位置自动完成在模态内不起作用

use*_*572 0 javascript jquery modal-dialog twitter-bootstrap bootstrap-modal

我在模态中使用谷歌自动完成。当我单击输入字段时,它会在模态后面显示结果。我没有使用任何 css。它在模态之外完美地工作。但它在模态内不能正常工作。请帮我。

HTML代码

<div class="form-group">
    <p class="control-label1">City</p>
    <input type="text" id="locationTextField" placeholder="" name="city" class="form-control">
</div>
Run Code Online (Sandbox Code Playgroud)

Javascript代码

//Google Map
function initialize() {
    var input = document.getElementById('locationTextField');
    var autocomplete = new google.maps.places.Autocomplete(input);
}

function validateCity() {
    searchfield = $('#locationTextField').val();
    if (searchfield == "" || searchfield == null) {
        return false;
    }
    else {
        $('#locationTextField').val('');
        return false;
    }
}
google.maps.event.addDomListener(window, 'load', initialize);
Run Code Online (Sandbox Code Playgroud)

use*_*572 6

我通过在 css 中添加以下代码找到了答案

div.pac-container {
   z-index: 1050 !important;
}
Run Code Online (Sandbox Code Playgroud)