document.getbyId（）不适用于div类模式

Question

我需要从模态中获取值以将它们添加到我们的firebase数据库，但是当我尝试从document.getbyId获取模态值时，它们会返回空值。

这里的语气和我试图使用JavaScript代码：

var message_element = document.getElementById('message'); 
var name_element = document.getElementById('name'); 
var time_element = document.getElementById('time'); 
var submitBtn = document.getElementById('submitBtn'); 
var venue_element = document.getElementById('venue'); 
var route_element = document.getElementById('route'); 
var date_element = document.getElementById('date'); 
function saveData(){ 
    alert("Hello! I am an alert box!!"); 
    var firebaseRef = firebase.database().ref().child("Message"); 
    var text = message_element.value; 
    var route = route_element.value; 
    var name = name_element.value; 
    var date = date_element.value; 
    var time = time_element.value; 
    var venue = venue_element.value; 
    var now = new Date(); 
    var today = now.getFullYear()+"-"+(now.getMonth()+1)+"-"+now.getDate(); 
    var ID = now.getFullYear()+""+(now.getMonth()+1)+""+now.getDate()+""+now.getHours()+""+now.getMinutes()+""+now.getSeconds()+""+now.getMilliseconds(); 
    firebaseRef.child(ID).set({ 
     date: date, 
     time: time, 
     type: name, 
     venue: venue, 
     route: route, 
     message: text 
     }); 
} 

<div id="myAdd" class="modal fade" role="dialog"> 
    <div class="modal-dialog"> 
     <div class="modal-content"> 
      <div class="modal-header"> 
       <button type="button" class="close" data-dismiss="modal">&times;</button> 
       <h4 class="modal-title">Set Schedule</h4> 
      </div> 

      <div class="modal-body"> 

       <label class="control-label" for="venue" style="padding:5px 0px 0px 0px">Date</label> 
       <!-- <div class='input-group date' id='datepicker'> 
        <input type="text" class="form-control" /> 
        <span class="input-group-addon"> 
        <span class="glyphicon glyphicon-calendar"></span> 
        </span> 
       </div> -->   
       <div class="input-group input-append date" id="datepicker1"> 
        <input type="date" id="date" class="form-control" name="date" /> 
        <span class="input-group-addon add-on"><span class="glyphicon glyphicon-calendar"></span></span> 
       </div> 

       <label class="control-label" for="venue" style="padding:5px 0px 0px 0px">Time</label> 
       <input type="time" id="time" class="form-control" min="2016-01-02"> 

       <label class="control-label" id="type" for="venue" style="padding:5px 0px 0px 0px">Notification Type</label> 
       <select class="form-control"> 
        <option>Select type</option> 
        <option>Event</option> 
        <option>Notification</option> 
        <option>Reminder</option> 
       </select> 

       <label class="control-label" for="venue" style="padding:5px 0px 0px 0px">Venue</label> 
       <input type="text" class="form-control" id="venue" name="venue" placeholder="Venue"> 


       <label class="control-label" for="venue" style="padding:5px 0px 0px 0px">Route No.</label> 
       <select class="form-control" id="route"> 
        <option>Select route</option> 
        <option>1</option> 
        <option>2</option> 
        <option>3</option> 
        <option>4</option> 
        <option>5</option> 
       </select> 


       <label class="control-label" for="venue" style="padding:5px 0px 0px 0px">Message</label> 
       <textarea class="form-control" rows="3" id="message" placeholder="Type your message here..."></textarea>   

      </div> 

      <div class="modal-footer"> 
       <div class="col-md-6"> 
        <input class="btn btn-block btn-warning pull-right" data-dismiss="modal" value="Cancel" /> 
       </div> 

       <div class="col-md-6"> 
        <input class="btn btn-success btn-block" onclick="saveData()" id="submitBtn" type="submit" value="Set Schedule" /> 
       </div> 
      </div> 
     </div> 
    </div> 
</div> 

Answer 1

尝试...这个工作对我来说...获取数据，但错误是火力是没有定义，但你可能已经定义了这个权利？

<script> 

function saveData(){ 
    var message_element = document.getElementById('message'); 
    var name_element = document.getElementById('name'); 
    var time_element = document.getElementById('time'); 
    var submitBtn = document.getElementById('submitBtn'); 
    var venue_element = document.getElementById('venue'); 
    var route_element = document.getElementById('route'); 
    var date_element = document.getElementById('date'); 
    alert(message_element.value); 
    var firebaseRef = firebase.database().ref().child("Message"); 
    var text = message_element.value; 
    var route = route_element.value; 
    var name = name_element.value; 
    var date = date_element.value; 
    var time = time_element.value; 
    var venue = venue_element.value; 
    var now = new Date(); 
    var today = now.getFullYear()+"-"+(now.getMonth()+1)+"-"+now.getDate(); 
    var ID = now.getFullYear()+""+(now.getMonth()+1)+""+now.getDate()+""+now.getHours()+""+now.getMinutes()+""+now.getSeconds()+""+now.getMilliseconds(); 
    firebaseRef.child(ID).set({ 
     message: text 
    }); 
} 

</script>