使用Google Closure从LabelInput访问数据

时间:2013-08-14 11:46:31

标签: javascript html google-closure-compiler google-closure google-closure-library

我正在尝试读取通过自动完成获得的输入并将其显示为警报。访问后,我将未定义为alert而不是通过labelinput访问的值。

ex.js文件如下

goog.require('goog.dom');
goog.require('goog.ui.LabelInput');
goog.require('goog.ui.ac');
goog.require('goog.events.EventType');
function autoComplete() {
    var jobj = [{"cityname":"Bangalore","cityid":"1"},
    {"cityname":"Bellary","cityid":"2"},
    {"cityname":"Belgaum","cityid":"3"},
    {"cityname":"Bidar","cityid":"4"},
    {"cityname":"Mumbai","cityid":"5"},
    {"cityname":"Munnar","cityid":"6"},
    {"cityname":"Delhi","cityid":"7"},
    {"cityname":"Diu/Daman","cityid":"8"}];
    var li1 = new goog.ui.LabelInput("Enter City Name");
        li1.render(goog.dom.getElement('d1'));
    var array1 = new Array();
        for (var i=0;i<jobj.length; i++)
        {
        array1[i] = jobj[i].cityname;
        }
    var ac2 = goog.ui.ac.createSimpleAutoComplete(
        array1, goog.dom.getElement('d1'), false);
    goog.events.listen(ac2,
        goog.ui.ac.AutoComplete.EventType.UPDATE,
        function() { var val2 = (goog.dom.getElement('d1').value);
        alert(val2);
        });
}

ex.html文件如下

<html>
  <head>
    <script src="../closure-library/closure/goog/base.js"></script> <!--My Closure Library Location -->
    <script src="ex.js"></script>
  </head>
  <body onload="autoComplete();">
    <style>
        .ac-renderer {
        position: absolute;
        width: 300px;
        background-color: #fff;
        border: 1px solid;
        }
    </style>
        <div id="d1">City &nbsp </div><br><br>
    </body>
</html>

1 个答案:

答案 0 :(得分:3)

“goog.dom.getElement('d1')”将返回一个div元素,该元素没有值。调用

时,LabelInput会在该元素内部呈现控件
li1.render(goog.dom.getElement('d1')); 

您应该使用LabelInput类本身的getValue方法

li1.getValue()

或者如果要访问在LabelInput呈现方法期间创建的Input元素,请调用

li1.getElement().value

来源:http://docs.closure-library.googlecode.com/git/class_goog_ui_LabelInput.html