jQuery Plugin: Character Count Like Twitter

عندما تضع حدود لشيء يجب عليك اظهار هذه الحدود للمستخدم وان تنبهه لها .. هذا بالضبط ما فعله تويتر في موقعة، فهو يقوم بتحديد لك عدد الحروف التي تستطيع كتابتها في تدويناتك المصغرة بـ 140 حرف ولا يتركك عند ذلك فحسب بل يضع لك ايضاً عداد حتى يحسب لك ما تبقي من حروف.

اضافتنا هذه والخاصة بالـ jQuery تقوم بنفس العمل .. فهي تقوم بحساب عدد الحروف التي تقوم بكتابتها داخل الـ input او الـ textarea وإظهار تحذير في حال اقتراب انتهاء عدد المسموح بها او إذا انتهت عدد الحروف المسموح بها

هذه الاضافة من برمجة Alen Grakalic وقد قمت بتطويرها حتى تعمل بشكل أفضل ومشابه أكثر لمثيلتها في تويتر .. ما يميز هذه الإضافة عن غيرها من طرق حساب عدد الحروف هي انها لا تحتاج ان تكتب الكثير من الإكواد؛ فقط هو تعريف الحقل وإضافة كود ادراج اللإضافة.

• مثال
• تحميل

JavaScript

<script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>
<script src="charCount.js" type="text/javascript"></script>
<script type="text/javascript">
jQuery(document).ready(function(){
//default usage
$('.charCount').charCount();
//custom usage
$(".CustomCount").charCount({
counterElement: 'div',
allowed: 140,
warning: 25,
counterText: 'الحروف المتبقية: '
});
});
</script>

HTML

<textarea class="charCount" name="textarea"></textarea>

Css

.counter {
font-size: 20px;
font-weight: bold;
color: #ccc;
}
.warning {
color: #600;
}
.exceeded {
color: #e00;
}