كيف أجعل مدخل النص الخاص بي هو اللغة العربية؟

أريد أن أجعل مربع النص الخاص بي كمربع نص عربي يعني عندما أكتب اسمي يجب أن يظهر باللغة العربية في وقت الكتابة

ما حاولت:

لا شيء لأنه ليس لدي أي فكرة

الحل 2
الحل 1
الحل 3

الحل 2

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
	<script>
		
var yas;
function arabicValue(txt) {
    yas = txt.value;
yas = yas.replace(/`/g, "ذ");
yas = yas.replace(/0/g, "۰");
yas = yas.replace(/1/g, "۱");
yas = yas.replace(/2/g, "۲");
yas = yas.replace(/3/g, "۳");
yas = yas.replace(/4/g, "٤");
yas = yas.replace(/5/g, "۵");
yas = yas.replace(/6/g, "٦");
yas = yas.replace(/7/g, "۷");
yas = yas.replace(/8/g, "۸");
yas = yas.replace(/9/g, "۹");
yas = yas.replace(/0/g, "۰");
yas  = yas.replace(/q/g, "ض");
yas  = yas.replace(/w/g, "ص");
yas  = yas.replace(/e/g, "ث");
yas  = yas.replace(/r/g, "ق");
yas  = yas.replace(/t/g, "ف"); 
yas  = yas.replace(/y/g, "غ");
yas  = yas.replace(/u/g, "ع");
yas  = yas.replace(/i/g, "ه");
yas  = yas.replace(/o/g, "خ");
yas  = yas.replace(/p/g, "ح");
yas  = yas.replace(/\[/g, "ج");
yas  = yas.replace(/\]/g, "د");
yas  = yas.replace(/a/g, "ش");
yas  = yas.replace(/s/g, "س");
yas  = yas.replace(/d/g, "ي");
yas  = yas.replace(/f/g, "ب");
yas  = yas.replace(/g/g, "ل");
yas  = yas.replace(/h/g, "ا");
yas  = yas.replace(/j/g, "ت");
yas  = yas.replace(/k/g, "ن");
yas  = yas.replace(/l/g, "م");
yas = yas.replace(/\;/g, "ك");
yas  = yas.replace(/\'/g, "ط");
yas  = yas.replace(/z/g, "ئ");
yas  = yas.replace(/x/g, "ء");
yas  = yas.replace(/c/g, "ؤ");
yas  = yas.replace(/v/g, "ر");
yas  = yas.replace(/b/g, "لا");
yas  = yas.replace(/n/g, "ى");
yas  = yas.replace(/m/g, "ة");
yas  = yas.replace(/\,/g, "و");
yas  = yas.replace(/\./g, "ز");
yas  = yas.replace(/\//g, "ظ");
yas  = yas.replace(/~/g, " ّ");
yas  = yas.replace(/Q/g, "َ");
yas  = yas.replace(/W/g, "ً");
yas  = yas.replace(/E/g, "ُ");
yas  = yas.replace(/R/g, "ٌ");
yas  = yas.replace(/T/g, "لإ");
yas  = yas.replace(/Y/g, "إ");
yas  = yas.replace(/U/g, "‘");
yas  = yas.replace(/I/g, "÷");
yas  = yas.replace(/O/g, "×");
yas  = yas.replace(/P/g, "؛");
yas  = yas.replace(/A/g, "ِ");
yas  = yas.replace(/S/g, "ٍ");
yas  = yas.replace(/G/g, "لأ");
yas  = yas.replace(/H/g, "أ");
yas  = yas.replace(/J/g, "ـ");
yas  = yas.replace(/K/g, "،");
yas  = yas.replace(/L/g, "https://www.codeproject.com/");
yas  = yas.replace(/Z/g, "~");
yas  = yas.replace(/X/g, "ْ");
yas  = yas.replace(/B/g, "لآ");
yas  = yas.replace(/N/g, "آ");
yas  = yas.replace(/M/g, "’");
yas  = yas.replace(/\?/g, "؟");
txt.value = yas;
}
	</script>
    <style type="text/css">
         body
        {
            font-family: Arial, Helvetica, sans-serif;
            
        }

    </style>
</head>
<body >
    <p>
        SIMPLE ARABIC TEXTBOX USING UNICODE CHARACTER
    </p>
    <table >
        <tr>
            <td>Arabic textbox1</td>
            <td>:</td>
            <td><input type="text" onkeyup="arabicValue(text1)" dir="rtl"  id="text1" /></td>
        </tr>
        <tr>
            <td>Arabic textbox2</td>
            <td>:</td>
            <td><input type="text" onkeyup="arabicValue(text2)" dir="rtl"  id="text2" /></td>
        </tr>
    </table>
</body>
</html>

الحل 1

سبق الرد هنا : كيفية ضبط لغة الإدخال العربية على مربع النص في asp.net[^]

الحل 3

سيساعد هذا الحل في منع لوحة المفاتيح الإنجليزية
ولكن بالنسبة لجهاز Android، يجب عليك استخدام keyup لأن الضغط على المفاتيح لا يعمل

الدالة تقييدInputOtherThanArabic($field) {
// الحروف العربية تقع في نطاق Unicode 0600 – 06FF
فار عربيCharUnicodeRange = /[\u0600-\u06FF]/;

$field.bind(“الضغط على المفتاح”، الوظيفة (الحدث) {
مفتاح فار = حدث.
// 0 = لوحة رقمية
// 8 = مسافة للخلف
// 32 = مساحة
إذا (مفتاح == 8 || مفتاح == 0 || مفتاح === 32) {
عودة صحيحة؛
}
var str = String.fromCharCode(key);
إذا (arabicCharUnicodeRange.test(str)) {
عودة صحيحة؛
}
alert(“يرجى ادخال المعلومات باللغة العربية”);
عودة كاذبة؛
});
$field.bind(“لصق”، الوظيفة (الحدث) {
var PastedData = events.originalEvent.clipboardData.getData(‘Text’);
إذا (arabicCharUnicodeRange.test(pastedData)) {
عودة صحيحة؛
}
alert(“يرجى ادخال المعلومات باللغة العربية”);
عودة كاذبة؛
});
}