TypeError: document.getElementById (...) имеет значение null, но идентификатор правильный, так как я также вызвал другую форму

Question

Я пытаюсь выполнить функцию, но эта ошибка продолжает появляться в консоли

TypeError: document.getElementById (...) имеет значение null fetch http://localhost: 8082 / app. js: 28368

Вот код HTML

<form id="player2">
           <div class="form-group">
            <label>Player 2 - From address:</label>
            <input type=" type" class="form-control" id="fromAddress2">
          </div>
          <input type="submit" value="player2" class="btn-primary" />

        </form>

Вот приложение. js

function fetch(){

document.getElementById("player2").addEventListener("submit", function(e){
  e.preventDefault();

 var fromAddress2 = document.getElementById("#player2 #fromAddress2").value;

console.log(fromAddress2);

OraclizeContract.deployed().then(function(instance) {

  console.log("Initializing");
  instance.deposit({from: fromAddress2, 
                    gas: 3000000,
                    value: web3.toWei(1, 'ether')}) //betAmount is a input box and fetching its value into betamount variable and passing it over here
                               .then(function(v){
                                       console.log(v);
                                       console.log("Function Executed");

                                 });
                       }).then(function() {
                                              console.log("Testing");
                       }).catch(function(e) {
                                               console.log(e);
                       });

})
}

Я проверил идентификаторы, но они верны, не могут понять, почему это не работает. Любая помощь высоко ценится

Answer 1

var fromAddress2 = document.getElementById("#player2 #fromAddress2").value;

должно быть вместо:

var fromAddress2 = document.querySelector("#player2 #fromAddress2").value;