JSFiddle - React, Tailwind, and code Playground

by Murat Kezli

HTML

<input type="text" onkeyup="buyukharf(this)">
<input type="text" onkeyup="kucukharf(this)">
<input type="text" onkeyup="ilkharfbuyuk(this)">

CSS

input{ width:100%; display:block; margin-bottom:15px; padding:10px; font-size:large; color:red;}

JavaScript

function buyukharf(textBox) {
    var deger = $(textBox).val();
    var specialLetters = { "i": "İ", "ş": "Ş", "ğ": "Ğ", "ü": "Ü", "ö": "Ö", "ç": "Ç", "ı": "I" };
    val = deger.replace(/(([iışğüçö]))/g, function (letter) { return specialLetters[letter]; });
    $(textBox).val(val.toUpperCase());
}

function kucukharf(textBox) {
    var val = $(textBox).val();
    var letters = { "İ": "i", "I": "ı", "Ş": "ş", "Ğ": "ğ", "Ü": "ü", "Ö": "ö", "Ç": "ç" };
    val = val.replace(/(([İIŞĞÜÇÖ]))/g, function (letter) { return letters[letter]; });
    $(textBox).val(val.toLowerCase());
}

function toTitleCase(str) {
    var specialLetters = { "i": "İ", "ş": "Ş", "ğ": "Ğ", "ü": "Ü", "ö": "Ö", "ç": "Ç", "ı": "I" };
    var letters = { "İ": "i", "I": "ı", "Ş": "ş", "Ğ": "ğ", "Ü": "ü", "Ö": "ö", "Ç": "ç" };
    var arr = str.split(' ');
    for (var i = 0; i < arr.length; i++) {
        arr[i] = arr[i].charAt(0).replace(/(([iışğüçö]))/g, function (letter) { return specialLetters[letter]; }).toUpperCase() + arr[i].substr(1).replace(/(([İIŞĞÜÇÖ]))/g, function (letter) { return letters[letter]; }).toLowerCase();
    }
    return arr.join(" ");
}

var capitalizeAll = function (input) {
    var specialLetters = { "i": "İ", "ş": "Ş", "ğ": "Ğ", "ü": "Ü", "ö": "Ö", "ç": "Ç", "ı": "I" };
    return input.replace(/^./, function (match) {
        return match.replace(/(([iışğüçö]))/g, function (letter) { return specialLetters[letter]; }).toUpperCase();
    });
};

function ilkharfbuyuk(textBox) {
    var val = $(textBox).val();
    $(textBox).val(toTitleCase(val));
}