Großbuchstabe erster Buchstabe der Variablen

86

Ich habe über das Internet gesucht und kann nichts finden, was mir helfen könnte. Ich möchte den ersten Buchstaben jedes Wortes in einer Variablen in Großbuchstaben schreiben.

Bisher habe ich versucht:

toUpperCase();

Und hatte kein Glück, da es alle Buchstaben in Großbuchstaben schreibt.

Ryryan
quelle

Antworten:

227

Verwenden Sie die Funktion .replace[MDN] , um die Kleinbuchstaben, die ein Wort beginnen, durch den Großbuchstaben zu ersetzen.

var str = "hello world";
str = str.toLowerCase().replace(/\b[a-z]/g, function(letter) {
    return letter.toUpperCase();
});
alert(str); //Displays "Hello World"


Bearbeiten: Wenn Sie mit anderen Wortzeichen als nur az arbeiten, ist der folgende (kompliziertere) reguläre Ausdruck möglicherweise besser für Ihre Zwecke geeignet.

var str = "петр данилович björn über ñaque αλφα";
str = str.toLowerCase().replace(/^[\u00C0-\u1FFF\u2C00-\uD7FF\w]|\s[\u00C0-\u1FFF\u2C00-\uD7FF\w]/g, function(letter) {
    return letter.toUpperCase();
});
alert(str); //Displays "Петр Данилович Björn Über Ñaque Αλφα"

Peter Olson
quelle
1
Dies funktioniert nicht mit Namen wie Björn Lüchinger, das wird BjöRn LüChinger. Irgendeine Lösung dafür?
Dediqated
2
@Dediqated Vielen Dank für den Hinweis, lassen Sie mich wissen, ob die Bearbeitung hilft.
Peter Olson
Funktioniert super! Irgendwelche Hinweise, wie die Änderung aussehen sollte, wenn ich nur das erste Zeichen der Zeichenfolge in Großbuchstaben konvertieren wollte? (anstelle jedes einzelnen Wortes)
Andres SK
6
@andufo Klar, das ist eigentlich viel einfacher zu machen. Verwenden Sie einfachstr[0].toUpperCase() + str.slice(1)
Peter Olson
@ PeterOlson danke für die Antwort! Ich habe damit auch var first = str.slice(0, str.indexOf(' ')); str = first.toLowerCase().replace(/^[\u00C0-\u1FFF\u2C00-\uD7FF\w]|\s[\u00C0-\u1FFF\u2C00-\uD7FF\w]/g, function(letter) { return letter.toUpperCase(); }) + str.substr(first.length);Sonderzeichen behandelt.
Andres SK
72

Viel einfacher:

$('#test').css('textTransform', 'capitalize');

Ich muss @Dementic etwas Ehre machen, mich auf den richtigen Weg zu führen. Viel einfacher als alles, was ihr vorschlägt.

vbullinger
quelle
31
Dies ändert nur die visuelle Darstellung der Zeichenfolge und nicht den Zeichenfolgenwert selbst.
Toxaq
1
Sie können dies zwar nicht auf Variablen anwenden, die aus der Datenbank abgerufen wurden, aber für andere Instanzen ist diese Methode sehr sauber
Armand
3
Hinweis: text-transform:capitalizewirkt sich nicht auf ALLE GROSSBUCHSTABEN aus.
Bob Stein
1
Was ist, wenn die Zeichenfolge (Variable) für eine andere Operation als nur für die Anzeige verwendet werden muss?
Fr0zenFyr
Beachten Sie, dass die Eingabe mit der Großschreibung
gespeichert und
25

http://phpjs.org/functions/ucwords:569 hat ein gutes Beispiel

function ucwords (str) {
    return (str + '').replace(/^([a-z])|\s+([a-z])/g, function ($1) {
        return $1.toUpperCase();
    });
}

(Der Kürze halber wurde der Funktionskommentar aus der Quelle weggelassen. Einzelheiten finden Sie in der verknüpften Quelle.)

BEARBEITEN: Bitte beachten Sie, dass diese Funktion den ersten Buchstaben jedes Wortes (wie in Ihrer Frage gefragt) und nicht nur den ersten Buchstaben einer Zeichenfolge (wie in Ihrem Fragentitel angegeben) in Großbuchstaben schreibt.

Jonathan Fingland
quelle
Dies funktioniert besser als die akzeptierte Lösung, bei der Wörter in einem Satz nach dem Apostroph groß geschrieben werden. So wird beispielsweise "Ich bin ein Beispiel" zu "Ich bin ein Beispiel"
lizardhr
Funktioniert nicht, wenn Ihre ursprüngliche Zeichenfolge einen Unterstrich enthält. Fügen Sie ihn zur besseren Leistung Ihrem REGEX hinzu. TY
Ruslan Abuzant
1
@ RuslanAbuzant Das würde eine andere Frage beantworten. Das Interpretieren eines Unterstrichs als Worttrennzeichen (oder allgemeines Leerzeichen) ist in Ordnung, aber nicht das, wonach OP gefragt hat ... und könnte sogar seinen Anwendungsfall brechen.
Jonathan Fingland
1
ucwords () ist scheiße. Es funktioniert nicht mit Unicode (insbesondere mit kyrillischen, griechischen und anderen mitteleuropäischen Alphabeten). Verwenden Sie besser mb_convert_case () im Back-End, z. B.: Mb_convert_case ($ _ POST ['name'], MB_CASE_TITLE, 'utf-8');
Aleksey Kuznetsov
14

wollte nur eine reine Javascript-Lösung hinzufügen (keine JQuery)

function capitalize(str) {
  strVal = '';
  str = str.split(' ');
  for (var chr = 0; chr < str.length; chr++) {
    strVal += str[chr].substring(0, 1).toUpperCase() + str[chr].substring(1, str[chr].length) + ' '
  }
  return strVal
}

console.log(capitalize('hello world'));

Rafael Herscovici
quelle
1
danke bro, will nur etwas korrigieren. Dies c < str.length;sollte seinchr < str.length;
Leysam Rosario
13

Ich stelle mir vor, Sie könnten substring () und toUpperCase () verwenden, um das erste Zeichen herauszuziehen, es in Großbuchstaben zu schreiben und dann das erste Zeichen Ihrer Zeichenfolge durch das Ergebnis zu ersetzen.

myString = "cheeseburger";
firstChar = myString.substring( 0, 1 ); // == "c"
firstChar.toUpperCase();
tail = myString.substring( 1 ); // == "heeseburger"
myString = firstChar + tail; // myString == "Cheeseburger"

Ich denke, das sollte für dich funktionieren. Wenn diese Daten angezeigt werden, können Sie dem Container eine Klasse mit der CSS-Eigenschaft "text-transform: capitalize" hinzufügen.

Fudgie
quelle
sollte es nicht wie firstChar = firstChar.toUpperCase () geben; ? Ich habe den Code in Node.js ausprobiert und musste das tun oder nichts hat sich geändert!
Adrian Adaine
9

Dazu benötigen Sie nicht einmal Javascript, wenn Sie es verwenden möchten

$('#test').css('textTransform', 'capitalize');

Warum nicht so wie CSS

#test,h1,h2,h3 { text-transform: capitalize; }

oder machen Sie es als Klasse und wenden Sie diese Klasse an, wo immer Sie sie brauchen

.ucwords { text-transform: capitalize; }
Bruce Smith
quelle
4
Willkommen bei Stackoverflow. Ihre Antwort schlägt eine Alternative vor (die in einigen Anwendungsfällen durchaus gültig sein kann), beantwortet die Frage jedoch nicht wirklich. Als ich die Frage verstand, wollte der Autor die Javascript-Variable tatsächlich transformieren und nicht nur ihre visuelle Darstellung.
Helmbert
3
Ja, aber andere Leute, die zu dieser Frage kommen, könnten mit Javascript- oder CSS-Antworten einverstanden sein, wie ich, und das war wirklich hilfreich ...
Brian Powell
6

Schon mal was gehört substr() ?

Für den Anfang:

$("#test").text($("#test").text().substr(0,1).toUpperCase()+$("#test").text().substr(1,$("#test").text().length));


[Aktualisieren:]

Danke an @FelixKling für den Tipp:

$("#test").text(function(i, text) {
    return text.substr(0,1).toUpperCase() + text.substr(1);
});
Chiffre
quelle
4
Anstatt die text() vier Male aufzurufen , übergeben Sie eine Funktion an text():$("#test").text(function(i, text) { return text.substr(0,1).toUpperCase()+text.substr(1);});
Felix Kling
1
Hier altes Korps ausgraben, aber wenn bekannt wäre, dass der Inhalt in ein Element eingeht, wäre es viel einfacher zu verwenden:$('#test').style.textTransform='capitalize';
Rafael Herscovici
Schließen, @Dementic, aber es sollte sein: $('#test').css('textTransform', 'capitalize'); Übrigens, das ist die beste Antwort hier. Ich werde es als Antwort einreichen.
Vbullinger
@vbullinger - beurteilen Sie meinen Code nicht, wenn ich ihn verdammt betrunken schreibe :) und ich liebe js, nicht jq, also ist mein Code falsch, aber nicht zu vieldocument.getElementById('test').style.textTransform='capitalize';
Rafael Herscovici
5

Aufbauend auf der Antwort von @ peter-olson ging ich ohne jQuery objektorientierter vor:

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

alert("hello world".ucwords()); //Displays "Hello World"

Beispiel: http://jsfiddle.net/LzaYH/1/

Mmalone
quelle
Dies ist meiner Meinung nach wirklich der richtige Weg. Ich würde es toUpperCaseWordsin Übereinstimmung mit Javascript toUpperCase()undtoLowerCase()
AB Carroll
4
var mystring = "hello World"
mystring = mystring.substring(0,1).toUpperCase() + 
mystring.substring(1,mystring.length)

console.log(mystring) //gives you Hello World
Nick Chan Abdullah
quelle
3
var ar = 'foo bar spam egg'.split(/\W/);
for(var i=0; i<ar.length; i++) {
  ar[i] = ar[i].substr(0,1).toUpperCase() + ar[i].substr(1,ar[i].length-1) 
}
ar.join(' '); // Foo Bar Spam Egg
erickb
quelle
3

Sie können diesen einfachen Code mit den Funktionen von ucwords in PHP ausprobieren.

function ucWords(text) {
    return text.split(' ').map((txt) => (txt.substring(0, 1).toUpperCase() + txt.substring(1, txt.length))).join(' ');
}
ucWords('hello WORLD');

Die Großbuchstaben bleiben unverändert.

IamMHussain
quelle
2

Basierend auf der Antwort von @Dementric kann diese Lösung mit der einfachen jQuery-Methode 'ucwords' aufgerufen werden. Vielen Dank an alle, die hier beigetragen haben !!!

$.extend({
ucwords : function(str) {
    strVal = '';
    str = str.split(' ');
    for (var chr = 0; chr < str.length; chr++) {
        strVal += str[chr].substring(0, 1).toUpperCase() + str[chr].substring(1, str[chr].length) + ' '
    }
    return strVal
}

});

BEISPIEL: Dies kann mit der Methode aufgerufen werden

var string = "this is a test";
string = $.ucwords(string); // Returns "This Is A Test"
JoomGuy
quelle
2

Sie können text-transform: capitalize;für diese Arbeit verwenden -

HTML -

<input type="text" style="text-transform: capitalize;" />

JQuery -

$(document).ready(function (){
   var asdf = "WERTY UIOP";
   $('input').val(asdf.toLowerCase());
});

Versuche dies

Hinweis: Es wird nur die visuelle Darstellung der Zeichenfolge geändert. Wenn Sie diese Zeichenfolge benachrichtigen, wird immer der ursprüngliche Wert der Zeichenfolge angezeigt.

Ishan Jain
quelle
2

Es ist so einfach wie das Folgende:

string = 'test';
newString = string[0].toUpperCase() + string.slice(1);
alert(newString);
Sol
quelle
0

Die Zeichenfolge, die vor dem Großschreiben des ersten Buchstabens abgesenkt werden soll.

(Beide verwenden die Jquery-Syntax)

function CapitaliseFirstLetter(elementId) {
    var txt = $("#" + elementId).val().toLowerCase();
    $("#" + elementId).val(txt.replace(/^(.)|\s(.)/g, function($1) {
    return $1.toUpperCase(); }));
    }

Zusätzlich eine Funktion zum Großschreiben der GANZEN Zeichenfolge:

function CapitaliseAllText(elementId) {
     var txt = $("#" + elementId).val();
     $("#" + elementId).val(txt.toUpperCase());
     }

Syntax für das Klickereignis eines Textfelds:

onClick="CapitaliseFirstLetter('TextId'); return false"
Rubyist
quelle
0

Ich habe diesen Code verwendet -

function ucword(str){
    str = str.toLowerCase().replace(/(^([a-zA-Z\p{M}]))|([ -][a-zA-Z\p{M}])/g, function(replace_latter) { 
        return replace_latter.toUpperCase();
    });  //Can use also /\b[a-z]/g
    return str;  //First letter capital in each word
}

var uc = ucword("good morning. how are you?");
alert(uc);
Chinmay235
quelle
0

Html:

<input class="capitalize" name="Address" type="text" value="" />

Javascript mit jQuery:

$(".capitalize").bind("keyup change", function (e) {
        if ($(this).val().length == 1)
            $(this).val($(this).val().toUpperCase());
        $(this).val($(this).val().toLowerCase().replace(/\s[\p{L}a-z]/g, function (letter) {
            return letter.toUpperCase();
        }))
    });
Robert Benyi
quelle
0

Ohne JQuery

String.prototype.ucwords = function() {
    str = this.trim();
    return str.replace(/(^([a-zA-Z\p{M}]))|([ -][a-zA-Z\p{M}])/g, function(s){
        return s.toUpperCase();
    });
};

console.log('hello world'.ucwords()); // Display Hello World
GerardMetal
quelle
0

 var str = "HELLO WORLD HELLO WORLD HELLO WORLD HELLO WORLD";
         str = str.replace(
                        /([A-Z])([A-Z]+)/g,
        				function (a, w1, w2) {
                            return w1 + w2.toLowerCase();
                        });
alert(str);

Felsen
quelle
0

Hier ist die Unicode-sichere Funktion ucwords (), die zusätzlich doppelte Nachnamen wie russische Засс-Ранцев und einige edle Namen wie Honoré de Balzac, d'Artagnan, Vincent van Gogh, Otto von Bismarck, Sulaymān ibn Dāwūd usw. berücksichtigt.

String.prototype.ucwords = function() {
  return this.toLowerCase()
    .replace(/(^|\s|\-)[^\s$]/g, function(m) {
       return m.toUpperCase();
    })
    // French, Arabic and some noble names...
    .replace(/\s(Of|De|Van|Von|Ibn|Из|Ван|Фон|Ибн)\s/g, function(m) { // Honoré de Balzac, Vincent van Gogh, Otto von Bismarck, Sulaymān ibn Dāwūd etc.
       return m.toLowerCase();
    })
    .replace(/(^|\s)(D|Д)(['’][^\s$])/g, function(m, p1, p2, p3) { // D'Artagnan or d'Artagnan / Д’Артаньян или д’Артаньян
       return p1 + (p1 === "" ? p2/*.toUpperCase()*/ : p2.toLowerCase()) + p3.toUpperCase();
    });
}
Aleksey Kuznetsov
quelle
0

Einfachste Möglichkeit, den ersten Buchstaben in JS in Großbuchstaben zu schreiben

var string = "made in india";

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

alert(string );

Ergebnis: "Made In India"

Liebe Kumar
quelle