jquery saisie de texte contrôle de la longueur

la saisie de texte permet uniquement de trois mots séparés par des espaces, et s'il dépasse 3, l'utilisateur ne peut pas saisie de plus, est-ce possible à l'aide de jQuery?
Je peux utiliser l'événement keyup pour écouter, mais comment puis-je arrêter de l'utilisateur de taper dans plus de jetons sans l'aide de personnes handicapées.
C'est en quelque sorte similaire à la maternelle propriété maxlength pour la saisie de texte en html, sauf que le maxLength dans ce cas est le nombre de jetons.

N'oubliez pas de vérifier côté serveur: les utilisateurs peuvent activer JavaScript désactivé.

OriginalL'auteur user121196 | 2009-07-02

  1. 8

    Vérifier si l'entrée a déjà 3 mots et qu'ils tentent d'entrer un espace. Si oui return false:

    $('#myTextbox').keydown(
    function(event)
    {
        var input = $(this).val();
        var numberOfWords = input.split(' ').length;
        if(numberOfWords == 3 && event.keyCode == 32)
        {
            return false;
        }
    }
);

    Edit:
    Il y avait une question supplémentaire à propos de la situation où quelqu'un pourrait le texte dans le champ. Comme un navigateur croix de solution je serais probablement lier un code similaire à @karim79 est le flou de l'événement.

    $('#myTextbox').blur(
    function(e)
    {
        var tokens = $(this).val().split(' ');
        if(tokens.length > 3) 
        {
            $(this).val(tokens.slice(0,3).join(' '));
        }
    }
);
    +1 la solution Solide
    très bon. comme quelqu'un l'a mentionné ci-dessus, est-il un navigateur croix façon de gérer la situation où l'utilisateur faire un copier-coller dans l'entrée? la pâte événement n'est pas cross-browser.
    le flou de l'événement ne fonctionne pas vraiment pour la détection de coller depuis la saisie de texte est la mise au point avant de passé, et toujours dans le focus après le collage. une autre idée?
    Je ne suis pas au courant de croix-navigateur de façon à obtenir la pâte de l'événement. La solution que j'ai fourni, au moins s'assurer que la chaîne est tronquée en avant de la soumettre. Voir stackoverflow.com/questions/237254 pour en savoir plus sur JavaScript coller des événements.
    C'est ce que vous appelez "penser en dehors de la boîte". Fantastique!!!!

    OriginalL'auteur Jataro

  2. 3

    EDIT: quelque Chose comme cela devrait le faire (testé):

        $('#myTextbox').keyup(function(e){
        var wordArr = $(this).val().split(' ');
        if(wordArr.length > 3 && e.keyCode == 32) {
            var arrSlice = wordArr.slice(0,3);
            var newStr = arrSlice.join(' ');
            $(this).val(newStr);
        }
    });

    Si l'utilisateur tente de taper plus de trois mots, le contenu sera écrasé avec seulement les trois premiers mots. Cette solution permet d'afficher les caractères étant supprimés lorsqu'ils sont saisis si trois mots sont dépassées, offrant ainsi un peu de feedback.

    Si ce n'est pas le comportement souhaité, @Jataro la solution est le chemin à parcourir.

    Pense qu'il doit permettre à l'ensemble des mots
    Sera-ce l'arrêter quelqu'un à partir d'un clic droit et coller une grande quantité de texte dans le champ?
    Oups, juste vu que. L'édition...
    Il dit qu'il veut permettre à trois mots, et non pas trois caractères.
    non, il aurait besoin de se lier à la pâte d'événements à gérer que

    OriginalL'auteur karim79

  3. 0

    Peut être quelque chose comme,

    $('#myTextbox').change(

    function()
    {
         var input = $(this).val();
         var numberOfWords = input.split(' ').length;
         if(numberOfWords > 3)
         {
              $(this).val(input.substring(0, input.lastIndexOf(' ')-1));
         }
    }
);

    Je n'ai pas vérifié ce code, mais quelque chose comme cela devrait fonctionner.

    Et oui, comme mgroves dit, n'oubliez pas de re-valider tout ce qui est sur le serveur.

    OriginalL'auteur SolutionYogi