فارسی سازی اعداد در صفحات وب با جاوا اسکریپت

به نام او که از موشک های اسراییل قوی تر است !
سلام و درود به طرفدارای عزیز وبلاگ امیر ، حتما برای شما هم پیش آمده که در صفحه وبلاگ و یا وبسایت خود دوست داشتید اعداد انگلیسی را فارسی نمایش دهید و همیشه موفق به این امر نبوده اید برای مثال شما اگه از یک فونت فارسی استفاده کنید تمام اعداد صفحه شما فارسی میشه و نکته منفی این روش فارسی شدن کارکترهای عددی در تگ های input هستش چون مثلا کاربر اگر در ادرس ایمیلش عدد باشد موقع تایپ آن در input آن اعداد فارسی تایپ می شود و ظاهر جالبی ندارد هرچند در عملکرد مشکلی بوجود نمی آورد . از دیدگاه من اگر می خواهید در وب از فونت استفاده کنید به خصوص فونت های فارسی که بحث ما هست حتما از فونت های اصلاح شده وب استفاده کنید برای مثال همین فونت BYekan که من در وبلاگم استفاده می کنم 2 نسخه دارد یکی که هم اعداد رو فارسی می کند که همانند فونت اصلی می باشد و دیگری فونت اصلاح شده وب هست که این مزیت را دارد تا اعداد را فارسی نکند و کیفیت نمایش خوبی در سایزهای بزرگ دارد . خوب سوال اینجاست اگه ما از فونت اصلاح شده استفاده کردیم چگونه تمامی اعداد صفحه یا بخش هایی از آن را فارسی کنیم ؟ برای پاسخ به این سوال در ادامه مطلب با ما همراه باشید .

برای این منظور به معرفی کدی که آقای بهنام امامیان دوست عزیزمان نوشته اند می پردازیم ، کدی بسیار جذاب برای جاواکارها که تمام اعداد درون صفحه رو بررسی می کند و با اعداد فارسی جایگزین می کند به کد زیر توجه داشته باشید .

/*
Convert English Numbers to Persian in a web page
Behnam Emamian(www.BehnamEmamian.com)
*/
 
String.prototype.toPersianDigit = function (a) {
    return this.replace(/\d+/g, function (digit) {
        var enDigitArr = [], peDigitArr = [];
        for (var i = 0; i < digit.length; i++) {
            enDigitArr.push(digit.charCodeAt(i));
        }
        for (var j = 0; j < enDigitArr.length; j++) {
            peDigitArr.push(String.fromCharCode(enDigitArr[j] + ((!!a && a == true) ? 1584 : 1728)));
        }
        return peDigitArr.join('');
    });
};
 
function TraceNodes(Node) {
    if (Node.nodeType == 3)  //TextNode
        Node.nodeValue = Node.nodeValue.toPersianDigit();
    else
        for (var i = 0; i < Node.childNodes.length; i++)
            TraceNodes(Node.childNodes[i]);
}
 
TraceNodes(document);

همان طور که مشاهده می کنید که استاتیک بالا شما را در امر فارسی کردن اعداد کمک می کند اما یه سوال مطرح می شود اگر ما از این کد استفاده کردیم ، تمام صفحه اعدادش فارسی می شوند اگر نیاز باشه یه قسمت از صفحه اعدادش ترجمه نشود باید چی کار کرد ؟ من با کمک از "Ginden" در وبسایت "Stackoverflow.com" به کد زیر رسیدم .

function getParentLang(node) {
    var defaultLang = 'fa';
    var currLang = null;
    while(currLang === null && node.parentNode) {
        if (node.getAttribute && node.getAttribute('lang')) {
            currLang = node.getAttribute('lang');
        }
        node = node.parentNode;
    }
    return currLang || defaultLang;
}
function TraceNodes(e) {
    if (e.nodeType == 3 && getParentLang(e) === 'fa' /* Persian */) {
        e.nodeValue = e.nodeValue.toPersianDigit();
    } else {
        for (var t = 0; t < e.childNodes.length; t++) {
            TraceNodes(e.childNodes[t]);
        }
    }
}
String.prototype.toPersianDigit = function(e) {
    return this.replace(/\d+/g, function(t) {
        var n = [],
            r = [];
        for (var i = 0; i < t.length; i++) {
            n.push(t.charCodeAt(i))
        }
        for (var s = 0; s < n.length; s++) {
            r.push(String.fromCharCode(n[s] + (!!e && e == true ? 1584 : 1728)))
        }
        return r.join("")
    })
};
TraceNodes(document);

کد بالا کمک می کند تا تمام صفحه همانند کد قبلی ترجمه شود اما اگر خواستیم تا قسمتی دچار تغییرات نشود فقط کافیست از صفت یا به اصطلاح خودم از المنت lang در کد html استفاده کنیم تا در آن ناحیه تغییراتی صورت نگیرد ، برای مثال :  <div lang="en"></div>

امیداورم مورد استفاده شما دوستان عزیز واقع گردد ، در پناه حق شاد و سرزنده باشید .