JavaScript-Laufzeit-Fehler: Objekt unterstützt keine Eigenschaft oder Methode " addEventListener

Bin mit Asp.Net 2.0, versuche, Dateien per drag & drop mit asp.net.
für diesen Prozess bin über folgenden js ist

<script src="../Scripts/jquery-1.7.2.min.js" type="text/javascript"></script>
<script src="../Scripts/modernizr-2.5.3.js" type="text/javascript"></script>

deshalb kommt der Fehler wie dieser

JavaScript runtime error: Object doesn't support property or method 'addEventListener

bin mit IE11

also ich war früher ein code 

<meta http-equiv="X-UA-Compatible" content="IE=edge;" />

es nicht funktioniert

und mein Skript ist 

 <script type="text/javascript" language="javascript">



    var selectedFiles;

      $(document).ready(function () {
alert("");
        if (!Modernizr.draganddrop) {
        //alert("2");
          alert("This browser doesn't support File API and Drag & Drop features of HTML5!");
          return;
        }

        var box;
        box = document.getElementById("box");
       alert(box);
        box.addEventListener("dragenter", OnDragEnter, false);
        box.addEventListener("dragover", OnDragOver, false);
        box.addEventListener("drop", OnDrop, false);

        $("#upload").click(function () {
          var data = new FormData();
          for (var i = 0; i < selectedFiles.length; i++) {
            data.append(selectedFiles[i].name, selectedFiles[i]);
          }
          $.ajax({
            type: "POST",
            url: "FileHandler.ashx",
            contentType: false,
            processData: false,
            data: data,
            success: function (result) {
              alert(result);
            },
            error: function () {
              alert("There was error uploading files!");
            }
          });
        });

      });;

      function OnDragEnter(e) {
        e.stopPropagation();
        e.preventDefault();
      }

      function OnDragOver(e) {
        e.stopPropagation();
        e.preventDefault();
      }

      function OnDrop(e) {
        e.stopPropagation();
        e.preventDefault();
        selectedFiles = e.dataTransfer.files;
        $("#box").text(selectedFiles.length + " file(s) selected for uploading!");
      }



    </script>

und meine aspx-Seite ist 

<body>
<form id="form1" runat="server">
<center>
  <div id="box">Drag & Drop files from your machine on this box.</div>
  <br />
  <input id="upload" type="button" value="Upload Selected Files" />
</center>
</form>

Aber diese Anwendung Dateien per drag & drop funktioniert in chrome und firefox
problem nur im IE

Schlagen Sie mich um eine Lösung.
Vielen Dank im Voraus.

  • Was ist das Objekt, das zurückgegeben werden (Feld = document.getElementById("box");)? Ist es ein div?
  • ja, es ist ein div
InformationsquelleAutor Bala | 2015-07-09
  1. 0

    nehmen ie11 von Ihrem met-tag, und stattdessen den folgenden code hinzufügen. Dies erklärt sich hier.

    /* IE11 Fix for SP2010 */
if (typeof UserAgentInfo.strBrowser !== 'undefined' && !window.addEventListener) {
     UserAgentInfo.strBrowser=1;
}
    • Ich habe bereits versucht dies. aber nicht arbeiten
    • Warum Sie denken, die Frage hat nichts zu tun mit Sharepoint?
    InformationsquelleAutor hiradyazdan
  2. 0

    Was ist dein Dokument-Modus " im IE?

    F12 drücken, und Sie sollten sehen eine dropdown-Liste mit einer Zahl oder das Wort edge, stellen Sie sicher, es ist für die edge. Obwohl Sie mit dem meta-tag zum festlegen des Dokument-Modus, wenn Sie zuvor hatte es auf etwas anderes wird es außer Kraft setzen.

    • ja, wenn ich edge kein Fehler kommt , aber die anderen sind design treffen aufeinander und das drag und drop nicht funktioniert .
    InformationsquelleAutor BurkDiggler
  3. 0

    Bearbeiten Sie die plunkr, um zu sehen, wo es nicht klappt - ich habe keine jQuery-1.7.2 zur hand...aber getestet in internet explorer 11 und kann nicht sehen, dass Fehler. Ich bin mit dem click-Ereignis, wie es ein einfacher Fall zu erzeugen, in der browser und es wird die addEventListener () - Methode werfen.

    http://embed.plnkr.co/Smm421v5In2YYJAJXNTW/preview

    <!DOCTYPE html>
<html>

  <meta http-equiv="X-UA-Compatible" content="IE=edge;" />
  <head>
    <meta charset="utf-8" />
    <title></title>
    <link data-require="[email protected]" data-semver="3.0.0-rc2" rel="stylesheet" href="http://netdna.bootstrapcdn.com/bootstrap/3.0.0-rc2/css/bootstrap.min.css" />
    <link rel="stylesheet" href="style.css" />
    <script data-require="jquery" data-semver="2.0.3" src="http://code.jquery.com/jquery-2.0.3.min.js"></script>
    <script data-require="[email protected]" data-semver="3.0.0-rc2" src="http://netdna.bootstrapcdn.com/bootstrap/3.0.0-rc2/js/bootstrap.min.js"></script>
    <script src="script.js"></script>
  </head>
  <body>
    <h1>Hello Plunker!</h1>
    <div id="box" style="height: 100px; background-color: red">Click area</div>
  </body>
</html>

    ...und im Skript...

    'use strict';
/* global $ */


console.log("Hey!");
$(document).ready(function() {
  var box;
  box = document.getElementById("box");
  console.log(box);
  box.addEventListener("click", OnClick, false);
});    

var OnClick = function() {
  console.log('in OnClick');
  $("#box").text("Clicked");
};
    InformationsquelleAutor Will
  4. 0

    Dies ist wegen der Kompatibilität Problem hinzufügen unten im web.config-Datei 

    <system.webServer>
    <httpProtocol>
        <customHeaders>
            <add name="X-UA-Compatible" value="IE=EmulateIE9" />
        </customHeaders>
    </httpProtocol>
</system.webServer>
    InformationsquelleAutor A.RANGANATH
Schreibe einen Kommentar