addEventListener 不工作，总是返回 null

Question

我正在尝试在我的 firebase 中设置一个新值，但我总是收到错误 Uncaught TypeError: Cannot read property 'addEventListener' of null。 Firebase.js 加载到文件的头部。 我必须对代码进行哪些更改才能使其正常工作？

index.html

<div class="container">     
    <div class="form-group">
        <input type="text" id="txtUsername" class="form-control">
        <input type="text" id="txtBirthday" class="form-control">
        <input type="text" id="txtFn" class="form-control">
        <button id="btUpdateDb" class="btn btn-primary">Update</button>
    </div>
</div>

<script>
    var txtUsername = document.getElementById("txtUsername").value,
        txtBirthday = document.getElementById("txtBirthday").value,
        txtFn = document.getElementById("txtFn").value,
        btUpdateDb = document.getElementById("btUpdateMessage"),
        rootRef = new Firebase("https://test5421234.firebaseio.com"),
        ref = new Firebase("https://test5421234.firebaseio.com/people"),
        usersRef = ref.child("users");

    btUpdateDb.addEventListener("click", function () {
        "use strict";
        usersRef.set(txtUsername);
    });

</script>

Answer 1

您没有正确选择此元素。具体来说，您不会传递按钮的 id。因此你得到这个错误

这个btUpdateDb = document.getElementById("btUpdateMessage"), 应该改为这个btUpdateDb = document.getElementById("btUpdateDb"),，它会像一个魅力一样工作。