Question

我有2个输入字段，并且地方的自动完成仅在一个输入字段工作，我知道getElementById仅适用于1个ID，我尝试了getElementsbyClass但是这不起作用。

如何让它在两个输入字段都有效？

html代码

public class ConnectionMgr {

    private static ConnectionMgr instance = null;

    private static final String USERNAME = "root";
    private static final String PASSWORD = "";
    private static final String M_CONN_STRING = "jdbc:mysql://localhost:3306/generator";
    private static final String H_CONN_STRING = "jdbc:hsqldb:data/generator";

    private DBType dbType = DBType.MYSQL;

    private Connection conn = null;


    private ConnectionMgr() {
    }

    public static ConnectionMgr getInstance() {
        if (instance == null) {
            instance = new ConnectionMgr();
        }
        return instance;
    }

    public void setDBType(DBType dbType) {
        this.dbType = dbType;
    }

    private boolean openConnection() {
        try {
            switch (dbType) {

                case MYSQL:
                    Class.forName("com.mysql.jdbc.Driver");
                    conn = DriverManager.getConnection(M_CONN_STRING, USERNAME, PASSWORD);
                    return true;

                case HSQL:
                    conn = DriverManager.getConnection(H_CONN_STRING, USERNAME, PASSWORD);
                    return true;

                default:
                    return false;
            }
        } catch (SQLException | ClassNotFoundException e) {
            System.err.println(e);
            DBUtil.processException((SQLException) e);
            return false;
        }
    }

    public Connection getConnection() {
        if (conn == null) {
            if (openConnection()) {
                System.out.println("Connection opened");
                return conn;
            } else {
                return null;
            }
        }
        return conn;
    }

    public void processException(SQLException e) {
        System.err.println("Silgleton connection()Error -->");
        System.err.println("Erroe message:" + e.getMessage());
        System.err.println("Error code:" + e.getErrorCode());
        System.err.println("Error State:" + e.getSQLState());
    }

    public void close() {
        System.out.println("Closing connection");
        try {
            conn.close();
            conn = null;
        } catch (Exception e) {
        }
    }
}

js code

<script src="https://maps.googleapis.com/maps/api/js?sensor=false&libraries=places"></script>
<input id="autocomplete" name=origin type=text placeholder=Vertreklocatie>
<input id="autocomplete2" name=destination type=text placeholder=Bestemming>

http://codepen.io/anon/pen/EjvWLE

提前致谢

Answer 1

您可以使用getElementsByClassName，但需要遍历项目

这是一个更新的codepen。 http://codepen.io/anon/pen/WvEpKx

function initialize() {
    var inputs = document.getElementsByClassName('autocomplete');
    var options = {componentRestrictions: {country: 'nl'}};

    for(var i = 0; i < inputs.length; i++){
      new google.maps.places.Autocomplete(inputs[i], options); 
    }
}

google.maps.event.addDomListener(window, 'load', initialize);

Answer 2

apache 8758 0.0.0.1 33052 7308 ? S S 03:50 0:00 /usr/sbin/httpd - DFOREGROUND
apache 1421 0.0.0.2 5128 2780 ? R 15:24 0:00 ps aux

应该有效。它返回一个数组。所以你必须循环遍历它们，或者通过索引得到它，即var input = document.getElementsByClassName('autocomplete');

如何用getElementsByClass选择两个输入字段？

2 个答案: