it-swarm.com.de

jQuery Title Case

Gibt es einen eingebauten Weg mit jQuery zum "title case" einer Zeichenfolge? So etwas wie Bob Smith, so wird es zu "Bob Smith"?

33
AnApprentice

Sie brauchen dazu nicht jQuery. Dies kann mit der nativen .replace() -Methode erreicht werden:

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

Sie können css verwenden, wie:

.className 
{
    text-transform:capitalize;
}

Dadurch wird der erste Buchstabe groß geschrieben. Lesen Sie mehr hier

47
TNC

In jQuery 1.4+ können Sie (zumindest) verwenden 

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

Ich konnte es nicht finden, als ich die Dokumentation das letzte Mal durchgesehen habe, aber sie ist vorhanden und wird intern verwendet.

20
Pjotor

Es ist nichts in jQuery eingebaut, das dies tut, aber Sie können diese Site mit einem grundlegenden Codebeispiel aufrufen:

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

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

Es scheint, als könnten Sie von dort aus den Code so aufrufen:

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

ist viel einfacher ...
Sie müssen einen Rückruf als Ersatz verwenden.

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

Sie können RegExp in/[-\s]\w/g oder/(^ | [- \ s])\w/g oder andere ändern.

4
Ramiro

Wenn Sie die schrecklichen Menschen auf der Welt bekämpfen wollen, die TYPE IN ALL CAPS verwenden, und auch gleichzeitig Titelkoffer damit, können Sie diese Variante der Top-Antwort hier verwenden:

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

Ich weiß, dass diese Frage ein bisschen alt ist, aber

Hier ist meine Version der camelCase-Funktion:

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);
    };
})();

Es behandelt alle folgenden Edge-Fälle:

  • übernimmt standardmäßig sowohl Unterstriche als auch Bindestriche (konfigurierbar mit zweitem Parameter)
  • zeichenfolge mit Unicode-Zeichen
  • zeichenfolge, die mit Bindestrichen oder Unterstrich endet
  • zeichenfolge mit aufeinander folgenden Bindestrichen oder Unterstrichen

Hier ist ein Link zu Live-Tests: http://jsfiddle.net/avKzf/2/

Hier sind Ergebnisse aus Tests:

  • eingabe: "ab-cd-ef", Ergebnis: "abCdEf"
  • eingabe: "ab-cd-ef-", Ergebnis: "abCdEf"
  • eingabe: "ab-cd-ef--", Ergebnis: "abCdEf"
  • eingabe: "ab-cd - ef--", Ergebnis: "abCdEf"
  • eingabe: "--ab-cd - ef--", Ergebnis: "AbCdEf"
  • eingabe: "--ab-cd -__- ef--", Ergebnis: "AbCdEf"

Beachten Sie, dass Zeichenfolgen, die mit Trennzeichen beginnen, am Anfang zu einem Großbuchstaben führen. Wenn dies nicht der Fall ist, können Sie lcfirst verwenden.

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

Verwenden Sie die eingebaute Camelcase-Methode in jquery:

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

Sie können auch eine reine Javascript-Erweiterungsmethode wie folgt implementieren:

String.prototype.capitalize = function () {

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

Und nenne es so:

"HELLO world".capitalize()
1
student

Sie können diese Methode auch verwenden -

toTitleCase: function (str) {
        return str.replace(/\w\S*/g, function (txt) { return txt.charAt(0).toUpperCase() + txt.substr(1).toLowerCase(); });
    }
0
<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

Ich habe den Code von rBizzle leicht geändert. Ich möchte mich nicht mit den McClouds und McIntoshs der Welt herumschlagen (ich höre gerade keltische Musik!), Daher habe ich eine Bedingung hinzugefügt, die nur ALLE CAPS oder ALLE Kleinbuchstaben ändern sollte:

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;
	}
}

Ich versuche meistens, mit den Benutzern zu kämpfen, die darauf bestehen, ihren Dateneintrag zu schreien! Es ist eine Sache für interne Daten, aber wenn die Kunden dies sehen werden, muss ich die Grenze ziehen.

0
Cheryl Miller