Maison > interface Web > js tutoriel > 15 méthodes et astuces courantes jquery pour share_jquery

15 méthodes et astuces courantes jquery pour share_jquery

WBOY
Libérer: 2016-05-16 16:20:37
original
1215 Les gens l'ont consulté

1. Obtenez les étiquettes de ligne et de colonne de td

Copier le code Le code est le suivant :

$(this).prop('cellIndex')

2. Déterminez si la touche Entrée est enfoncée
Copier le code Le code est le suivant :

var monÉvénement = événement || fenêtre.événement
var key = monEvent.keyCode;
si(clé == 13){
//À ce moment, appuyez sur Entrée
>

3. Sélectionner tout et inverser la sélection
Copier le code Le code est le suivant :

$("#selectall").click(function(){
If($("input[name='id[]']").is(":checked")){
​​​​ $("input[name='id[]']").prop("checked",false);
}autre{
​​​​ $("input[name='id[]']").prop("checked",true);
>
});

4. Double-cliquez pour modifier, entrez pour enregistrer l'événement de double-clic de l'élément td dans le tableau
Copier le code Le code est le suivant :

$("td").dblclick(function(){
var tdIns = $(this);
var tdpar = $(this).parents("tr");
tdpar.css("couleur de fond","jaune");
If (tdIns.children("input").length>0){ return false }
var inputIns = $(""); //Code de la zone de saisie qui doit être inséré
var texte = $(this).html();
InputIns.width(tdIns.width()); //Définir l'entrée pour qu'elle soit cohérente avec la largeur td
inputIns.val(tdIns.html()); // Copiez le contenu td de la cellule d'origine dans la zone de texte insérée
tdIns.html(""); //Supprimer le contenu td de la cellule d'origine
inputIns.appendTo(tdIns).focus().select(); //Insérez le code de la zone de saisie qui doit être inséré dans le nœud dom
inputIns.click(function(){return false;});
inputIns.keyup(function(event){
//1. Déterminez s'il faut appuyer sur Entrée
//La différence de temps d'acquisition entre les différents navigateurs pour la fin
var monEvénement = événement || window.event
        var key = myEvent.keyCode;  
Si(clé == 13){
            var inputNode = $(this); //1. Enregistrez le contenu de la zone de texte actuelle
            var inputText = inputNode.val(); //2. Effacez le contenu de td
                     inputNode.parent().html(inputText);                                                                                                                                                                             });
//Gérer les événements Enter et Esc
inputIns.blur(function(){
        var inputText = $(this).val();  
         tdIns.html(inputText);
        tdpar.css("background-color","white");            tdIns.html(text);                                     });
});


5. Élément parent $(this).parent();
6. Spécifiez l'élément frère suivant de l'élément $(this).next();
7. Tous les éléments frères de l'élément spécifié $(this).nextAll();
8. Spécifiez l'élément et tous les éléments frères $(this).andSelf();
9.prev() : récupère l'élément frère précédent de l'élément spécifié (le précédent).
10.prevAll() : récupère tous les éléments frères et sœurs devant l'élément spécifié.
11. Obtenez des éléments enfants

Méthode 1 :>

Copier le code Le code est le suivant :
var aNods = $("ul > a");// Trouvez ul sous Tous les tags

Méthode 2 : enfants()
Méthode 3 : trouver()

Remarque :

1> Les méthodes children et find sont toutes deux utilisées pour obtenir les éléments enfants de l'élément. Aucune d'elles ne renverra un nœud de texte, tout comme la plupart des méthodes jQuery.
2> La méthode children n'obtient que les éléments enfants situés en dessous de l'élément, à savoir : les enfants immédiats.
3> La méthode find obtient tous les éléments subordonnés, à savoir : les descendants de ces éléments dans l'arborescence DOM
4> Le sélecteur de paramètres de la méthode children est facultatif (facultatif) et est utilisé pour filtrer les éléments enfants, mais le sélecteur de paramètres de la méthode find est obligatoire.
5> La méthode find peut en fait être implémentée en utilisant jQuery (sélecteur, contexte). Autrement dit, $('li.item-ii').find('li') équivaut à $('li', 'li.item-ii').

12. Obtenez le premier élément :

Copier le code Le code est le suivant :

$("#getfirst").find("ul li:first-child")
$("#getfirst").find("ul li").get(0)
$("#getfirst").find("ul li").first()

13. Datepicker est un plug-in de sélection de date couramment utilisé
Copier le code Le code est le suivant :

$("#waybill_eta1").datepicker({dateFormat : 'aa-mm-jj'});

14. Plug-in datetimepicker pour sélectionner la date et l'heure simultanément
Copier le code Le code est le suivant :

$('#declare_time').datetimepicker({
dateFormat : 'aa-mm-jj',
timeFormat : 'hh:mm',
        });

15.valider la méthode de vérification d'ajout régulière
Copier le code Le code est le suivant :

$.validator.addMethod("isCode", function(value, element) {
var reg = /^[^u4e00-u9fa5]{1,}$/;
           return this.optional(element) || (reg.test(value));
}, "Seuls les lettres, chiffres et traits de soulignement peuvent être saisis");
Étiquettes associées:
source:php.cn
Déclaration de ce site Web
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
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal