web-dev-qa-db-fra.com

jQuery Title Case

Y at-il une manière intégrée avec jQuery de "casse de titre" une chaîne? Donc, étant donné quelque chose comme Bob Smith, cela se transforme en "Bob Smith"?

javascriptjquerystring
33
AnApprentice

Vous n'avez pas besoin de jQuery pour cela; cela peut être accompli en utilisant la méthode native .replace() :

function toTitleCase(str) {
    return str.replace(/(?:^|\s)\w/g, function(match) {
        return match.toUpperCase();
    });
}

alert(toTitleCase("foo bar baz")); // alerts "Foo Bar Baz"
60
Ben Blank

Vous pouvez utiliser css, comme:

.className 
{
    text-transform:capitalize;
}

Ceci capitalise la première lettre. Vous pouvez en lire plus ici

47
TNC

Dans jQuery 1.4+ (au moins), vous pouvez utiliser 

var camelized = jQuery.camelCase("some-string");
// Returns "someString"

Je ne pouvais pas le trouver lors de ma dernière vérification de la documentation, mais celle-ci est utilisée en interne.

20
Pjotor

JQuery n’est intégré à rien qui le fasse, mais vous pouvez consulter ce site qui contient un exemple de code de base:

http://jamesroberts.name/blog/2010/02/22/string-functions-for-javascript-trim-to-camel-case-to-dashed-and-to-underscore/

String.prototype.toCamel = function(){
    return this.replace(/(\-[a-z])/g, function($1){return $1.toUpperCase().replace('-','');});
};

Il semblerait qu'à partir de là, vous pouvez appeler le code comme suit:

var str = "my string to camel case";
str = str.toCamel();
if ( typeof console !== 'undefined' ) console.log(str);
5
Seth

est beaucoup plus simple ...
Vous devez utiliser un rappel en remplacement.

toCamelCase = function(str){
  return str.replace(/-\w/g,function(match){return match[1].toUpperCase()})
}
// this works for css properties with "-" 
// -webkit-user-select => WebkitUserSelect

Vous pouvez modifier RegExp en/[-\s]\w/g ou/(^ | [- \ s])\w/g ou autre ...

4
Ramiro

Si vous voulez combattre les terribles peuples du monde qui tapent TOUT EN MAJUSCULES, et que vous intitulez le titre en même temps, vous pouvez utiliser cette variante de la réponse principale ici:

function toTitleCase(str) {
        var lcStr = str.toLowerCase();
        return lcStr.replace(/(?:^|\s)\w/g, function(match) {
            return match.toUpperCase();
        });
    }

alert(toTitleCase("FOO BAR baz")); // alerts "Foo Bar Baz"
4
RBizzle

Je sais que cette question est un peu vieille mais

Voici ma version de la fonction camelCase:

var camelCase = (function () {
    var DEFAULT_REGEX = /[-_]+(.)?/g;

    function toUpper(match, group1) {
        return group1 ? group1.toUpperCase() : '';
    }
    return function (str, delimiters) {
        return str.replace(delimiters ? new RegExp('[' + delimiters + ']+(.)?', 'g') : DEFAULT_REGEX, toUpper);
    };
})();

Il gère tous les cas Edge suivants:

  • prend en charge les traits de soulignement et les traits d'union par défaut (configurable avec le second paramètre)
  • chaîne avec caractères Unicode
  • chaîne qui se termine par un trait d'union ou un trait de soulignement
  • chaîne qui a des traits d'union ou des traits de soulignement consécutifs

Voici un lien pour les tests en direct: http://jsfiddle.net/avKzf/2/

Voici les résultats des tests:

  • entrée: "ab-cd-ef", résultat: "abCdEf"
  • entrée: "ab-cd-ef-", résultat: "abCdEf"
  • entrée: "ab-cd-ef--", résultat: "abCdEf"
  • entrée: "ab-cd - ef--", résultat: "abCdEf"
  • entrée: "--ab-cd - ef--", résultat: "AbCdEf"
  • entrée: "--ab-cd -__- ef--", résultat: "AbCdEf"

Notez que les chaînes commençant par des délimiteurs génèrent une lettre majuscule au début . Si ce n'est pas ce que vous attendez, vous pouvez toujours utiliser lcfirst .

function lcfirst(str) {
    return str && str.charAt(0).toLowerCase() + str.substring(1);
}
2
Joon

Utilisez la méthode camelcase intégrée dans jQuery:

$.camelCase($("#text").html());
1
Nalan Madheswaran
    function camelCase(str){
        str     = $.camelCase(str.replace(/[_ ]/g, '-')).replace(/-/g, '');
        return  str;//.substring(0,1).toUpperCase()+str.substring(1);
    },
1
surinder singh

Vous pouvez également implémenter une méthode d’extension javascript pure comme ceci:

String.prototype.capitalize = function () {

    return this.toLowerCase().replace(/\b[a-z]/g, function (letter) {
        return letter.toUpperCase();
    });
};

Et appelez ça comme ça:

"HELLO world".capitalize()
1
student

Vous pouvez également utiliser une méthode comme celle-ci -

toTitleCase: function (str) {
        return str.replace(/\w\S*/g, function (txt) { return txt.charAt(0).toUpperCase() + txt.substr(1).toLowerCase(); });
    }
0
Pritam Jyoti Ray
<html>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script>
$(document).ready(function () {


   $('.clsToTitleCase').keyup(function () { 

        this.value = this.value.replace(/(?:^|\s)\w/g, function (match) {
           return match.toUpperCase();
        })

    });
})
</script>

<body>

<input class='clsToTitleCase' type='text'>
</body>
</html>
0
SajithG

J'ai légèrement modifié le code de rBizzle. Je ne veux pas déconner avec les McClouds et les McIntosh du monde (j'écoute de la musique celtique en ce moment!), Alors j'ai ajouté une condition pour modifier uniquement si TOUT CAPS ou TOUT majuscule:

function isUpperCase(str) {
    return str === str.toUpperCase();
}

function isLowerCase(str) {
    return str === str.toLowerCase();
}

function toProperCase(str) {
	//only mess with it if it is all lower or upper case letters
	if (isUpperCase(str) || isLowerCase(str)){
	 	var lcStr = str.toLowerCase();
    	return lcStr.replace(/(?:^|\s)\w/g, function(match) {
       	 	return match.toUpperCase();
    	});	
	} else {
		return str;
	}
}

J'essaie surtout de composer avec les utilisateurs qui insistent pour crier leur entrée de données! C'est une chose pour les données internes, mais quand les clients vont le voir, je dois tracer la ligne.

0
Cheryl Miller