allow only arabic

HTML

<script src="https://code.jquery.com/jquery-2.1.4.min.js"></script>

Solution1: 
<input id="txtArabic1" />
<br/>

Solution2:
<input id="txtArabic2" />

CSS

.has-error {
  background-color: red;
  color: white;
}

JavaScript

var isArabic = /^([\u0600-\u06ff]|[\u0750-\u077f]|[\ufb50-\ufbc1]|[\ufbd3-\ufd3f]|[\ufd50-\ufd8f]|[\ufd92-\ufdc7]|[\ufe70-\ufefc]|[\ufdf0-\ufdfd])*$/g;

// Solution 1: This will add an error class when the input does not match
$("#txtArabic1").change(function() {
    $(this).toggleClass("has-error", !isArabic.test(this.value));
})

// Solution 2: This will not let the user type chars that are not arabic
// but seem to fail on my browser... I don't quite get how does javascript splits the string.
$("#txtArabic2").bind('keyup', function(e) {
	var filterFn = isArabic.test.bind(isArabic),
    	newValue = this.value.split('').filter(filterFn).join('');
  
	if (this.value != newValue)
  	this.value = newValue;
});