未捕获的TypeError:无法读取属性' addEventListener'在window.onload中为null

时间:2017-07-23 20:53:24

标签: html5

未捕获的TypeError:无法读取属性' addEventListener'在window.onload上的null

我收到了标题中提到的错误,大多数人提到的解决方案都是使用window.onload函数,但我已经这样做了所以我会请求大家提供正确的指导在这个问题上。

提前感谢您回答我的问题。



(function() {
  var Applicant = {
    flname: "",
    add: "",
    mobnum: "",
    status: "",
    lat: "",
    lng: "",
    inNeedof: "",
  };

  var storageLogic = {
    saveItem: function() {
      var lscount = localStorage.length;
      var inputs = document.getElementByClassName("form-control");
      Applicant.flname = inputs[0].value;
      Applicant.add = inputs[1].value;
      Applicant.mobnum = inputs[2].value;
      Applicant.status = inputs[3].value;
      Applicant.lat = inputs[4].value;
      Applicant.lng = inputs[5].value;
      Applicant.inNeedof = inputs[6].value;

      localStorage.setItem("Applicant_" + lscount, JSON.stringify(Applicant));
      location.reload();
    },
    loaddata: function() {
      var datacount = localStorage.length;
      if (datacount > 0) {
        var render = "<table border='1'>";
        render += "<tr><th>Name</th>" + "<th>Address</th>" + "<th>Mobile Number</th>" + "<th>Status</th>" + "<th>Latitude</th>" + "<th>Longitude</th>" + "<th>In Need Of</th>";

        for (i = 0; i < datacount; i++) {
          var key = localStorage.key(i);
          var applicant = localStorage.getItem(key);
          var data = JSON.parse(applicant);

          render += "<tr><td>" + data.flname + "</td>";
          render += "<tr><td>" + data.add + "</td>";
          render += "<tr><td>" + data.mobnum + "</td>";
          render += "<tr><td>" + data.status + "</td>";
          render += "<tr><td>" + data.lat + "</td>";
          render += "<tr><td>" + data.lng + "</td>";
          render += "<tr><td>" + data.inNeedof + "</td>";
        }
        render += "</table";
        var newTable = document.getElementById("dvContainer");
        newTable.innerHTML = render;
      }

    }

  };
  window.onload = function() {
    storageLogic.loaddata();
    var btnsubmit = document.getElementById('btnsubmit');
    btnsubmit.addEventListener('click', storageLogic.saveItem, false);

  };
})();
&#13;
<!DOCTYPE html>
<html>

<head>
  <title>EndUser</title>
  <meta name="viewport" content="initial-scale=1.0">
  <!--JavaScript Links-->
  <script type="text/javascript" src="EndUser.js">
  </script>
  <!--CSS link-->
  <link rel="stylesheet" type="text/css" href="style.css">
</head>

<body id="b01">
  <div id="container">
    <div id="logo"></div>
    <div id="banner"><img src="images/emr.jpg" alt="Main Image" width="775" height="326" /></div>
    <div id="nav">
      <ul>
        <li class="nlink"> <a href="index.html"> Home</a></li>

        <li class="nlink"></li>

      </ul>
    </div>


  </div>
  <form id="f01" name="EmergencyPortalForm" onSubmit="return validateForm()" method="post">
    <fieldset>
      <legend style="font-size:25px"><b>Register your incident</b></legend>
      Enter your Name:
      <input type="text" class="form-control" id="flname" required><br/><br/> Address:
      <br/>
      <textarea name="address" rows="9" cols="25" class="form-control" id="add" required></textarea><br/><br/> Mobile Number:
      <input type="text" class="form-control" id="mobnum" required><br/><br/> In need of:
      <input list="vehicles" class="form-control" id="inNeedof" required>
      <datalist id="vehicles">
			<option value="Ambulance">
		    <option value="Fire Brigade">
	        <option value="Police">
			</datalist><br/><br/>
      <input id="btnsubmit" type="Submit" class="button" value="Submit"><br/><br/>
    </fieldset>
  </form>


  <h2 id="h01">Your Location:</h2>
  <div id="map" style="height:500px;width:720px">

    <script>
      var map, infoWindow;

      function initMap() {
        map = new google.maps.Map(document.getElementById('map'), {
          center: {
            lat: 22.760970,
            lng: 75.870431
          },
          zoom: 18
        });


        infoWindow = new google.maps.InfoWindow;


        if (navigator.geolocation) {
          navigator.geolocation.getCurrentPosition(function(position) {
            var pos = {
              lat: position.coords.latitude,
              lng: position.coords.longitude
            };

            infoWindow.setPosition(pos);
            infoWindow.setContent('Location found.');
            infoWindow.open(map);
            map.setCenter(pos);
          }, function() {
            handleLocationError(true, infoWindow, map.getCenter());
          });
        } else {

          handleLocationError(false, infoWindow, map.getCenter());
        }
      }

      function handleLocationError(browserHasGeolocation, infoWindow, pos) {
        infoWindow.setPosition(pos);
        infoWindow.setContent(browserHasGeolocation ?
          'Error: The Geolocation service failed.' :
          'Error: Your browser doesn\'t support geolocation.');
        infoWindow.open(map);
      }
    </script>
    <script async defer src="https://maps.googleapis.com/maps/api/js?key=AIzaSyDf5KXWxfU0BeeQdillzgRc3yXF2TkxSXY&callback=initMap">
    </script>
    <div id="footer"></div>
  </div>
</body>

</html>
&#13;
&#13;
&#13;

0 个答案:

没有答案