Question

我想在Google地方自动填充功能上设置国际化。通过选择一种语言，应用程序应为该语言加载正确的google api。

现在我有这个js代码：

function loadScript(src) {
    var script = document.createElement("script");
    document.body.appendChild(script);
    script.src = src;
};

$('#' + country_id).change(function(){
            delete google.maps;
            $('script').each(function () {
                if (this.src.indexOf('googleapis.com/maps') >= 0
                    || this.src.indexOf('maps.gstatic.com') >= 0
                    || this.src.indexOf('earthbuilder.googleapis.com') >= 0) {
                        // console.log('removed', this.src);
                        $(this).remove();
                    }
            });
            loadScript("http://maps.googleapis.com/maps/api/js?libraries=places&sensor=false&language=" + this.value);
            setTimeout(function(){ google_address(input_id, options_type, country_id, auto_complete) }, 2000);
    });

其中google_address是设置自动填充功能。这个解决方案不起作用，并在chrome上抛出错误：

Failed to execute 'write' on 'Document': It isn't possible to write into a document from an asynchronously-loaded external script unless it is explicitly opened.

也尝试使用google.load但没有更多成功...

任何想法都会非常受欢迎。

Answer 1

问题来自脚本调用的document.write来加载api。无法在页面加载时调用此函数。因此错误。

感谢this example我使用document.body.appendChild为每种语言制作了自定义加载器。

我也需要删除pac-container以取消绑定以前的语言选择。

Answer 2

只需在调用中添加回调参数即可防止出现此错误。

请注意"after page loading" == "asynchronous"

谷歌地图api页面加载调用后

2 个答案: