Maison > Article > interface Web > Deux solutions aux conflits de prototypes jQuery (avec téléchargement d'un exemple de démonstration)_jquery

Deux solutions aux conflits de prototypes jQuery (avec téléchargement d'un exemple de démonstration)_jquery

WBOYoriginal: 2016-05-16 15:19:061264parcourir

Cet article analyse deux solutions aux conflits de prototypes jQuery avec des exemples. Partagez-le avec tout le monde pour votre référence, les détails sont les suivants :

Comment jquery et prototype peuvent-ils entrer en conflit ? En dernière analyse, c'est parce que les deux utilisent $, et qu'ils sont utilisés en même temps, ce qui prête à confusion. Ce problème a été résolu pas moins de 5 fois, et je dois le vérifier à chaque fois. Ça ne fait pas mal, hehe.

Méthode 1. Ajoutez du code au fichier de bibliothèque principale de jquery.

1. Il s'agit généralement de jquery.js, ou jquery.min.js, certains avec des numéros de version. Sachez simplement de quel fichier il s'agit.

})( window );
jQuery.noConflict(); //最后面，加上这一行。

2. Charger les fichiers jquery et prototypes de test

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/prototype/1.7.1.0/prototype.js"></script>
<script src="jquery.min.js"></script>

3. Comment écrire du code js

<script type="text/javascript">
alert('prototype value : '+$('test').value); //prototype写法
jQuery(document).ready(function($){ //注意这里的，jQuery和$
  alert('jquery value : '+$('#test').val()); //jquery写法
});
</script>

J'ai recommandé cette méthode, cette méthode est plus efficace une fois pour toutes

Le code de démonstration complet est le suivant :

<html>
<head>
<script type="text/javascript" src="./prototype.js"></script>
<script src="jquery.min.js"></script>
</head>
<body>
<form>
<input id="test" type='text' name='test' value='test'/>
</form>
<script type="text/javascript">
alert('prototype value : '+$('test').value);
jQuery(document).ready(function($){
 alert('jquery value : '+$('#test').val());
});
</script>
</body>
</html>

Méthode 2 : Résoudre le conflit où jquery est appelé

1. Charger les fichiers jquery et prototypes de test

//jquery和prototype，没有先后顺序，谁先谁后都一样。
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/prototype/1.7.1.0/prototype.js"></script>

2.code js

<script type="text/javascript">
jQuery.noConflict(); //解决冲突，这个一定要放在js代码的最前面，不然就会报错了。
alert('prototype value : '+$('test').value);
jQuery(document).ready(function($){
  alert('jquery value : '+$('#test').val());
});
</script>

Cette méthode est plus adaptée aux situations où les fichiers sources principaux de jquery ne se trouvent pas sur votre propre serveur ou où le code jquery est relativement petit. L'exemple de démoCliquez ici pour voir.

La démo complète peut être cliqué iciTélécharger depuis ce site.

J'espère que cet article sera utile à tous ceux qui programment jQuery.

Déclaration：

Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn

Article précédent：Exemple d'algorithme de recherche binaire implémenté dans les compétences js_javascriptArticle suivant：Exemple d'algorithme de recherche binaire implémenté dans les compétences js_javascript

Articles Liés

Voir plus