Велика перша буква змінної


88

Я шукав в Інтернеті, не можу знайти нічого, що допомогло б мені. Я хочу зробити першу літеру кожного слова великим регістром у межах змінної.

Поки що я пробував:

toUpperCase();

І не пощастило, оскільки він пише великими літерами всі літери.


Відповіді:


227

Використовуйте функцію .replace[MDN], щоб замінити малі літери, що починають слово, з великої літери.

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


Редагувати: Якщо ви маєте справу з символами слів, відмінними від просто az, тоді такий (більш складний) регулярний вираз може краще відповідати вашим цілям.

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 Αλφα"


1
Це не працює з іменами типу Björn Lüchinger, це стає BjöRn LüChinger. Будь-яке виправлення для цього?
Виведено

2
@Dediqated Дякую, що вказали на це, повідомте мене, якщо редагування допоможе.
Пітер Олсон,

Чудово працює! Будь-які підказки про те, якою має бути модифікація, якщо я просто хотів перетворити у верхній регістр перший символ рядка? (замість кожного окремого слова)
Андрес СК

6
@andufo Звичайно, це насправді зробити набагато простіше. Просто скористайтесяstr[0].toUpperCase() + str.slice(1)
Пітер Олсон

@PeterOlson дякую за відповідь! Я закінчив використовувати також 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);для висвітлення спеціальних символів.
Андрес СК

72

Набагато простіший спосіб:

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

Я повинен віддати @Dementic деяку честь за те, що я повів мене правильним шляхом. Набагато простіше, ніж все, що ви пропонуєте.


32
Це змінює лише візуальне представлення рядка, а не саме значення рядка.
toxaq

1
Ви не можете застосувати це до змінних, отриманих з БД, але для інших випадків цей метод дуже чистий
Арманд

3
Примітка: text-transform:capitalizeне вплине на ВСІ ЗАГОЛОВКИ.
Боб Штейн,

1
Що робити, якщо рядок (змінну) потрібно використовувати для певних операцій, крім простого відображення?
Пт0zenFyr

зауважте, що це збереже введені дані з великої літери, він перетворить їх лише у поданні
Sherif Elkassaby

25

http://phpjs.org/functions/ucwords:569 має хороший приклад

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

(пропущений коментар функції з джерела для стислості. детальніше див. у зв’язаному джерелі)

EDIT: Зверніть увагу, що ця функція пише великі літери першої літери кожного слова (як задає ваше запитання), а не лише першу літеру рядка (як задає назва вашого запитання)


Це працює краще, ніж прийняте рішення, яке пише великі слова в реченні після апострофа, тому, наприклад, "Я приклад" стає "Я ПРИКЛАД"
lizardhr

Не працює, якщо у вашому початковому рядку є підкреслення, будь ласка, додайте його до вашого REGEX для кращої роботи. TY
Руслан Абузант

1
@RuslanAbuzant Це відповіло б на інше запитання. Інтерпретувати підкреслення як роздільник слів (або загальний пробіл) - це добре, але це не те, про що просив ОП ... і навіть може порушити його варіант використання.
Джонатан Фінгленд,

1
ucwords () відстій. Це не працює з Unicode (особливо з кирилицею, грецькою та іншими центральноєвропейськими алфавітами). Краще використовувати mb_convert_case () на задній панелі, наприклад: mb_convert_case ($ _ POST ['name'], MB_CASE_TITLE, 'utf-8');
Олексій Кузнєцов

14

просто хотів додати чисте рішення javascript (без 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'));


1
спасибі брате, просто хочу щось виправити. це c < str.length;повинно бутиchr < str.length;
Leysam Rosario

13

Я думаю, ви можете використовувати substring () і toUpperCase (), щоб витягнути перший символ, прописати його великими літерами, а потім замінити перший символ вашого рядка результатом.

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

Я думаю, що це має спрацювати для вас. Ще слід врахувати, що якщо ці дані відображаються, ви можете додати клас до його контейнера, який має властивість CSS "text-transform: capitalize".


чи не повинно бути як firstChar = firstChar.toUpperCase (); ? Я спробував код у Node.js, і мені довелося це зробити, або нічого не змінилося!
Adrian Adaine

9

Для цього вам навіть не потрібен Javascript, якщо ви збираєтеся використовувати

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

Чому б не зробити це так, як css

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

або зробіть це як клас і застосуйте його там, де вам це потрібно

.ucwords { text-transform: capitalize; }

4
Ласкаво просимо до Stackoverflow. Ваша відповідь пропонує альтернативу (яка може бути цілком справедливою у деяких випадках використання), але насправді не відповідає на запитання. Як я зрозумів питання, автор хотів насправді перетворити змінну Javascript, а не лише її візуальне представлення.
helmbert

3
Так, але інші люди, які приходять на це запитання, можуть погодитися з відповідями javascript АБО css, як я, і це було дуже корисно ...
Брайан Пауелл

6

Ви коли-небудь чули substr()?

Для початку:

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


[Оновлення:]

Дякую @FelixKling за підказку:

$("#test").text(function(i, text) {
    return text.substr(0,1).toUpperCase() + text.substr(1);
});

4
Замість того, щоб дзвонити text() чотири рази, передайте функцію text():$("#test").text(function(i, text) { return text.substr(0,1).toUpperCase()+text.substr(1);});
Феліксу Клінгу

1
розкопування тут старих корпусів, але якби було відомо, що вміст переходить у елемент, його було б набагато простіше використовувати:$('#test').style.textTransform='capitalize';
Рафаель Герсковічі

Закрийте, @Dementic, але так і повинно бути: ДО ВСЕ, це $('#test').css('textTransform', 'capitalize'); найкраща відповідь тут. Я подаю це як відповідь.
vbullinger

@vbullinger - не судіть мій код, коли я пишу його п'яним, як біса :), і я люблю js, а не jq, тому мій код помилковий, але не надтоdocument.getElementById('test').style.textTransform='capitalize';
Рафаель Герсковічі

5

Спираючись на відповідь @ peter-olson, я взяв більш об'єктно-орієнтований підхід без jQuery:

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

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

Приклад: http://jsfiddle.net/LzaYH/1/


На мій погляд, це дійсно найбільш правильний спосіб. Я б назвав це toUpperCaseWordsвідповідно до вимог javascript toUpperCase()таtoLowerCase()
AB Carroll


4

Найпростіший спосіб

let str="hiren raiyani"
str.toLowerCase().replace(/(?<= )[^\s]|^./g, a => a.toUpperCase());

користувацька функція:

function capitalize(str){
 return str.toLowerCase().replace(/(?<= )[^\s]|^./g, a => a.toUpperCase());
}

вихід: Хірен Раяні

Використовуйте код як визначену користувачем функцію або пряму


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

3

Ви можете спробувати цей простий код з функціями ucwords в PHP.

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

Верхні справи залишаться незмінними.


3

Це так просто, як наступне:

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

2

Засноване повністю на відповіді @Dementric, це рішення готове зателефонувати за допомогою простого методу jQuery, "ucwords" ... Дякуємо всім, хто тут зробив свій внесок !!!

$.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
}

});

ПРИКЛАД: Це можна назвати за допомогою методу

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

2

Ви можете використовувати text-transform: capitalize;для цієї роботи -

HTML -

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

JQuery -

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

Спробуйте це

Примітка: Це лише зміна візуального подання рядка. Якщо ви попереджаєте цей рядок, він завжди відображає початкове значення рядка.


0

Рядок, який потрібно опустити перед написанням першої літери великими літерами.

(Обидва використовують синтаксис Jquery)

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

На додаток до функції для написання великого рядка ЦІЛИЙ:

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

Синтаксис, який слід використовувати під час натискання текстового поля:

onClick="CapitaliseFirstLetter('TextId'); return false"

0

Я використав цей код -

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

0

HTML:

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

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

0

Без 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

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


0

Ось функція ucwords (), що захищає юнікод, яка додатково поважає подвійні прізвища, такі як російський Засс-Ранцев, та деякі благородні імена, такі як Оноре де Бальзак, д'Артаньян, Вінсент ван Гог, Отто фон Бісмарк, Сулайман ібн Давуд тощо:

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

0

Найпростіший спосіб написання великої літери в JS

var string = "made in india";

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

alert(string );

Результат: "Зроблено в Індії"


0
var country= $('#country').val();

var con=country[0].toUpperCase();

ctr= country.replace(country[0], con);
   

немає необхідності створювати будь-які функції, просто jugaaar

Використовуючи наш веб-сайт, ви визнаєте, що прочитали та зрозуміли наші Політику щодо файлів cookie та Політику конфіденційності.
Licensed under cc by-sa 3.0 with attribution required.