Empfangen Fehler 0x800a01b6 - JavaScript runtime error: Objekt unterstützt keine Eigenschaft oder Methode 'modal', bei der Verwendung von Bootstrap 3 modal

Habe ich eine einfache MVC 5 Projekt zu demonstrieren, das Problem hatte ich mit Visual Studio 2013 (Neu > Projekte > ASP.NET Web-Anwendung (4.5) > Leer (MVC)).

Dann habe ich die eine basic-controller und-Aktion für eine einfache Ansicht:

public class HomeController : Controller
{
    public ActionResult Index()
    {
        return View();
    }
}

Mit der folgenden Ansicht (Index.cshtml)

<!DOCTYPE html>

<html>
<head>
    <meta name="viewport" content="width=device-width" />
    <title>Index</title>
    <link href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css" rel="stylesheet">
</head>
<body>
    <div>
        <button type="button" class="btn btn-primary" id="new">New</button>
    </div>

    <!-- Modal -->
    <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                    <h4 class="modal-title" id="myModalLabel">Modal title</h4>
                </div>
                <div class="modal-body">
                    ...
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                    <button type="button" class="btn btn-primary">Save changes</button>
                </div>
            </div>
        </div>
    </div>

    <script src="//code.jquery.com/jquery-1.11.0.min.js"></script>
    <script src="//netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js"></script>

    <script type="text/javascript">
        $(document).ready(function () {
            //$('#myModal').modal();

            $('#new').click(function () {
                $('#myModal').modal();
            });
        });
    </script> 
</body>
</html>

Das problem, das ich habe, ist: wenn die Seite zum ersten mal geladen und ich klicken Sie auf die Schaltfläche zum anzeigen des modal, erhalte ich die folgende Fehlermeldung:

Empfangen Fehler 0x800a01b6 - JavaScript runtime error: Objekt unterstützt keine Eigenschaft oder Methode 'modal', bei der Verwendung von Bootstrap 3 modal

Jedoch, wenn ich die Seite aktualisieren und klicken Sie auf die Taste erneut, funktioniert es einwandfrei.

Auch wenn ich kommentieren Sie die Zeile //$('#myModal').modal(); und starten Sie das Projekt, das modal wird sofort geöffnet als erwartet, aber ein Klick auf die Schaltfläche noch verursacht den oben genannten Fehler.

Ich bin sicher, dies ist wahrscheinlich etwas zu einfach und ein school boy error auf meiner Seite aber für das Leben von mir ich kann nicht herausfinden, was Los ist oder wie das Problem zu diagnostizieren.

Sowieso jede Hilfe wird sehr geschätzt und ich wäre daran interessiert zu wissen, ob jemand replizieren kann, das Problem.

Edit: Seltsamerweise scheint dies nur dann geschehen, in Internet Explorer (11), und scheint gut zu funktionieren, in Chrome und Firefox.

InformationsquelleAutor teatime | 2014-03-23

  1. 2

    Schaltfläche findet die data-toggle und data-target Attribute, es sollte wie folgt Aussehen:

     <button type="button" class="btn btn-primary" data-toggle="modal" data-target="#myModal" id="new">New</button>

    Quelle: JavaScript Bootstrap

    Hi, danke für die Antwort. Obwohl das wäre in diesem Beispiel der Grund, ich bin mit JavaScript, da muss ich auch laden einige Daten und andere Dinge tun. Dieses Beispiel erstellt wurde, nur um zu replizieren, dass das Problem so einfach wie möglich.

    InformationsquelleAutor webeno

  2. 1

    OK, nach viel über Unordnung, ich hatte ein eureka moment, wenn das hinzufügen meiner letzten Bemerkung. Es funktioniert in anderen Browsern und Internet Explorer nicht. So begann ich zu schauen, was anders war mit Internet Explorer und es stellt sich heraus, ich hatte nicht entfernt die Avast Online Security Erweiterung.

    Also das deaktivieren dieser verursacht mein JavaScript zu laden, wie erwartet, und es ist alles in Ordnung (hatte ich bereits entfernt, aus Chrome, bevor Sie diese Entwicklung).

    Trotzdem hoffentlich jemand anderes helfen, bevor Sie bang Ihren Kopf gegen die Wand, wie ich es Tat.

    InformationsquelleAutor teatime

  3. 1

    Wenn ich hatte das gleiche problem, es stellte sich heraus, um eine unnötige Referenz auf ein jquery-bundle in meine .cshtml-Seite.

    InformationsquelleAutor soobow

Schreibe einen Kommentar