javascript - 如何在 Bootstrap 标签输入中使用谷歌音译API？

Question

我正在尝试在输入字段中使用谷歌音译 API，我已经做了 Bootstrap 标签输入，但音译 API 不起作用。如果我从输入字段中删除 Bootstrap 标签输入，音译 API 可以工作，但我需要两者bootstrap 标签输入以及音译 API。

这是我的实现代码。

写下您的标签，以逗号分隔:

        <p>
         <input type="text" class="form-control" name="tag_widget" value=""  style="width:100px;" id="tag_widget" data-role="tagsinput">

        </p> 

        <script type="text/javascript">      

     // Load the Google Transliteration API      

     google.load("elements", "1", {            

          packages: "transliteration"          

      });



var lang= decodeURIComponent("ne");

var e= 1;



  function onLoad() {

    var options = {

      sourceLanguage: 'en',            

      destinationLanguage: ['ne'],    //'hi','kn','ml','ta','te'

      shortcutKey: 'ctrl+g',   

      transliterationEnabled: e

    };



    var control =

        new google.elements.transliteration.TransliterationControl(options);



     var textArea=document.getElementById("tag_widget");
    //var textArea=$('.bootstrap-tagsinput span').val();

    var ids = [textArea];

    control.makeTransliteratable(ids);

     control.showControl('translControl');  
     $('#tag_widget').tagsinput('refresh');        

  }

  google.setOnLoadCallback(onLoad);

Assets /bootstrap-tagsinput/bootstrap-tagsinput.js">

Answer 1

您可以在输入 ta 之间尝试 id='ids'

<input type="text" class="form-control" name="tag_widget" value="" style="width:100px;" id="ids" data-role="tagsinput">