使用Google网站翻译插件选择2 - 超出最大调用堆栈大小

时间:2018-03-01 23:10:12

标签: javascript jquery jquery-select2

我已使用以下网站中显示的以下步骤在我的网站上添加了Google网站翻译器:

https://translate.google.com/manager/website/

如果您不熟悉上述链接,则可以帮助您创建html和javascript展示位置,以便显示下拉菜单。我试图将自定义添加到html和javascript(如下所述)。

为了与我构建的网站的主题保持一致,我尝试更改下拉菜单以使用select2插件。

$(window).load(function () {
    setTimeout(function () {

        $('.goog-te-combo').select2()
            .on('change', function (e) {
                //console.log($('.goog-te-combo').val());
                var event;

                event = document.createEvent('HTMLEvents');
                event.initEvent('change', true, true);
                document.getElementsByClassName('goog-te-combo')[0].dispatchEvent(event);
            });
    }, 1000);
});

<script type="text/javascript">
    function googleTranslateElementInit() {
        new google.translate.TranslateElement({ pageLanguage: 'en' }, 'google_translate_element');
    }
</script>
<script type="text/javascript" src="//translate.google.com/translate_a/element.js?cb=googleTranslateElementInit"></script>

上面的代码有效,我能够让网站使用select2,包括自动完成。

问题是,我超出了最大通话大小,这是因为我一遍又一遍地创建递归调度更改事件。换句话说,在我的select2 on change方法中,我将另一个更改事件分派给触发的同一元素,从而使循环发生。我很想知道是否还有解决这个问题的方法,或者是否有任何其他方法可以让它在没有任何错误的情况下运行。

1 个答案:

答案 0 :(得分:0)

几个小时后,我决定隐藏谷歌网站翻译,并创建一个新的下拉选择2选项,当我更改此下拉列表的值时,我更改隐藏的谷歌下拉列表的值。

所以我隐藏了这个:

<div id="google_translate_element"></div>

并创建了一个新的选择选项:

<select id="newGoogleTrans">
    <option disabled value="0">Select one</option>
    <option value="ar">Arabic</option>
    <option value="en">English</option>
    <option value="fr">French</option>
</select>

这就是我控制下拉菜单的方式:

$('#newGoogleTrans')
    .select2()
    .on('change', function () {
        value =  $('#newGoogleTrans').val();
        $('.goog-te-combo').val(value );
        document.getElementsByClassName('goog-te-combo')[0].dispatchEvent(event);
     })

编辑:

我还意识到需要更新下拉列表以反映您之前是否选择了下拉菜单,因为浏览器会以cookie的形式保存以前选择的谷歌翻译下拉列表的状态,因此为了更新select2下拉列表面:

var nameEQ = "googtrans=";
var cookieVal = "";
var ca = document.cookie.split(';');
for (var i = 0; i < ca.length; i++) {
    var c = ca[i];
    while (c.charAt(0) == ' ')
        c = c.substring(1, c.length);
    if (c.indexOf(nameEQ) == 0)
        cookieVal = c.substring(nameEQ.length, c.length).split("/")[2];
}
cookieVal = cookieVal == "" ? 'en' : cookieVal;
$('#newGoogleTrans').val(cookieVal );