Skip to content
Advertisement

How to compare value in JavaScript when keyup

I try to compare two string first ASCII (English) and second Unicode (Chinese). User need to type message in textarea and JavaScript will calculate how long the text and show some message.

Now its working only for ASCII (English) but I need to compare because condition for ASCII and Unicode is different.

Below is my current code snippet:

<script>

$('#myinput').keyup(function() {
    if(this.value.length<=152)
     $('#charcount').text('We will deduct 1 credit for this message per contact'), 
     $('#credit_value').val('1');
    else if(this.value.length>152 && this.value.length<298)
         $('#charcount').text('We will deduct 2 credit for this message per contact'),  
         $('#credit_value').val('2');
    else if (this.value.length>=298 && this.value.length<450)
        $('#charcount').text('We will deduct 3 credit for this message per contact'),
        $('#credit_value').val('3');
    else if (this.value.length>=450 && this.value.length<596)
        $('#charcount').text('We will deduct 4 credit for this message per contact'),   
        $('#credit_value').val('4');
    else if (this.value.length>=602 && this.value.length<754)
        $('#charcount').text('We will deduct 5 credit for this message per contact'),  
        $('#credit_value').val('5');
    })
</script>

For ASCII (English) I start with 152 but in Unicode (Chinese) I need to start with 60 and increase …

Below is the code that I’m using in PHP to check text/string in English or Chinese:

// check if message is type in chinese or english/UTF8
    if (preg_match("/p{Han}+/u", $message)) {
        $msg_type = '2';
        //this is chinese
    } else {
        $msg_type = '1';
        //this is UTF8/English
    }

So my problem now I need to check the string is type in ASCII or Unicode then if Chinese start condition value with 60 or if English start with 152.

Check my jsfiddle here.

Advertisement

Answer

Taken from this Answer

The following regex [^x00-x80]+ can be used to test for non ASCII characters. ([^u0000-u0080]+ for non Unicode Chars)

I assumed you want to match against non ASCII characters, that wasn’t made clear in your question

Update: If you want to match only Chinese Characters use this instead

var isChinese = /[u4E00-u9FFFu6300-u77FFu7800-u8CFFu8D00-u9FFF]+/

Given this you can just test the RegExp against the Text and display the according Message

I slimmed the code a little for demo simplicities sake, it only accounts for steps of 60/152

    var charCount = $('#charcount')
    $('#myinput').keyup(function () {
        var text = this.value;
        var isChinese = /[^x00-x80]+/
        var step = isChinese.test(text) ? 60 : 152;
        charCount.text('We will deduct '+ ~~(1 + ((text.length - 1) / step)) +' credit for this message per contact. Characters: '+text.length);
    })

Heres a Demo on JSFiddle

Update

So i changed it a little, to display an Error for non Chinese Unicode Characters. And let you define custom ranges

var charCount = $('#charcount');
$('#myinput').keyup(function () {
    var text = this.value;
    var isChinese = /[u4E00-u9FFFu6300-u77FFu7800-u8CFFu8D00-u9FFF]+/.test(text);
    if (!isChinese && (/[^x00-x80]+/.test(text))) {
        charCount.text("Error: Neither ASCII nor Chinese Unicode Character Entered");
        return;
    }
    var credits = {
        chinese: [
            [1, 60],
            [60, 130],
            [130, 190]
        ],
        english: [
            [1, 152],
            [152, 298],
            [298, 450],
            [450, 596],
            [602, 754]
        ]
    };
    var _credits = credits[isChinese ? "chinese" : "english"];
    var i;
    for (i = _credits.length; i > 1; i--) {
        if (text.length >= _credits[i - 1][0] && text.length < _credits[i - 1][1]) break;
    }
    charCount.text('We will deduct ' + i + ' credit for this message per contact. Characters: ' + text.length);
});

Heres another Fiddle for you

Advertisement