Comment faire fonctionner JQuery et ASP.Net?

Question

Y at-il une raison pour laquelle JQuery ne fonctionnerait pas lorsqu'il est utilisé dans une page ASPX? Nous avons essayé de faire fonctionner un appel simple comme ceci:

$(document).ready(function() { 
    alert("This is SPARTA!!!!!!!!!"); 
}); 

La boîte d'alerte n'est jamais montrée. J'ai eu une certaine expérience avec JS et ASP.Net avant avec des boutons et je sais que je dois retourner faux après la JS comme:

<input type=button value="Button 1" 
    onclick='button_1_onclick();return false;'> 

Y at-il une chose semblable à faire?

Modifié: J'ai lancé Firebug en mode débogueur et le JS n'est jamais exécuté, toutes les bibliothèques sont présentes dans la page. La seule chose que je peux penser est que l'événement prêt n'est pas déclenché ou quelque chose de similaire.

Answer 1

ASP.NET et JQuery sont très bien ensemble (et aussi avec la bibliothèque ASP.NET AJAX), je les ai tous utilisés ensemble sur une application Web ASP.NET 3.5 récente. Il y a quelques oddities to be aware of, mais dans l'ensemble fonctionnent bien ensemble.

Tout d'abord, vous devez vous assurer que vous avez une balise de script avec src de votre jQuery FILE-

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.1/jquery.min.js"></script> 

Je l'ai fait en général en ajoutant un ScriptReference au ScriptManager, mais de toute façon fonctionne. Ensuite, mettez votre code jQuery après la balise script -

$(function() { alert("This is SPARTA!!!!!!!!!"); }); 

Si votre fichier jQuery est dans un dossier et vous avez une sorte mis en place sur votre site d'authentification, vous devez vous assurer que le dossier est accessible sur le en utilisant jQuery, en modifiant le fichier web.config (comme vous le feriez avec les images et les css). J'ai été surpris par cela avant. Vous pouvez vérifier dans firebug pour voir si le code jQuery est accessible (c'est-à-dire visible) en développant le nœud de script approprié; Si vous voyez une sorte d'erreur HTTP, cela peut être dû au fait que le script n'est pas accessible.

Comme d'autres l'ont déjà dit, il pourrait y avoir des conflits avec d'autres bibliothèques JavaScript.Vous pouvez toujours utiliser le raccourci de $ si vous invoquez aussi des bibliothèques en utilisant le motif suivant

(function($) { 

$(function() { alert("This is SPARTA!!!!!!!!!"); }); 

})(jQuery); 

Cela signifie que $ dans le cadre de la fonction extérieure est un raccourci pour objet jQuery.

Answer 2

Utilisez-vous une autre bibliothèque en même temps? Le $ peut avoir été réaffecté, essayez ceci:

jQuery(document).ready(function() { 
    alert("This is SPARTA!!!!!!!!!"); 
}); 

Answer 3

Il pourrait y avoir deux resons pour cela:

1) Vous pourriez manquer la déclaration

<script language="JavaScript" src="JQuery.js"></script> 

.

2) Un point-virgule est manquant à la fin de votre alerte. Il devrait être:

$(document).ready(function() { alert("This is SPARTA!!!!!!!!!"); }); 

Answer 4

Avez-vous essayé de mettre la référence JavaScript après inclusion de CSS?

J'ai eu des problèmes où $(document).ready ne s'est pas exécuté car les classes CSS n'avaient pas été chargées. Déplacer le jQuery inclure semble régler le problème. Peut ne pas être le même que votre problème, mais cela vaut la peine d'essayer.

Answer 5

Peut-être que vous avez fait la même erreur que moi:

I inclus la référence de script jQuery dans ma page principale. Le résultat est que la page .Aspx n'a pas pu trouver le fichier JQuery.js, car je l'ai placé dans un dossier différent.

Dans le masterpage j'inclure maintenant jQuery, en utilisant

<script src="<%= this.ResolveUrl("~/js/jquery.js") %>"></script> 

Answer 6

J'ai essayé. Vous devez référencer la bibliothèque jquery et vous devez avoir la fonction $ (document) .ready. Vous devez également référencer votre bouton avec une classe afin que jquery puisse trouver le bouton que vous recherchez. Vous dites ensuite à jquery ce que vous allez faire avec cet objet, comme utiliser .click().

Voici un code: Référence à la bibliothèque jquery.

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.1/jquery.min.js"></script> 

Enveloppez le texte suivant dans une balise de script.

$(document).ready(function() 
    { 
     $('.clicker').click(function() 
     { 

      alert('This is SPARTA!!!!'); 
     }); 
    }); 

Puis dans le code HTML de la page que vous faire de votre bouton comme ceci:

<input type="button" value="Show Alert" class="clicker" /> 

Hope this helps certains.