20
مرداد

محدودیت در فرم ها با jQuery

یکی از مشکلاتی که امروزه میتواند بسیار خطرناک باشد, این است که به هر فردی اجازه بدهیم , داخل فرم ها هر اطلاعاتی که دوست داشته باشد وارد نماید, و تنها زمانی میتوانیم جلوی این کار را بگیریم

که قبل از ارسال شدن اطلاعات, اشتباه کاربر به او اعلام گردد. این دقیقا مانند همین میباشد که شما تنها به دلیل اشتباه وارد نمودن پسوورد تا رعایت کردن قوانین برای انتخاب پسوورد قوی, کل اطلاعات فرم را دوباره پر نمایید و سپس در نهایت متوجه شوید که برای انتخاب پسوورد باید از اعداد هم استفاده می نمودید.

یکی از راه حل هایی که بتوانیم جلوی این مشکل را بگیریم در این مقاله که در زمینه طراحی وب سایت برای شما فراهم شده است,به شما توضیح داده خواهد شد. آیا شما میتوانید در یک دستگاه ATM کاراکترهای بزرگ را وارد نمایید؟ جواب منفی خواهد بود. چرا که کیبورد ATM تنها اعداد را نشان میدهند. شما میتوانید شماره اشتباهای را انتخاب نمایید, اما شما هرگز نمیتوانید آدرس ایمیل خود را وارد نمایید و یا اطلاعات نام و نام خانوادگی.

البته کیبوردی که شما استفاده میکنید اطلاعات مختلفی را به صورت آنلاین میتوانید وارد نمایید. میتوانید بین 75 تا 100 دکمه را در کیبورد فشار دهید و در ثانی با گرفتن دکمه های دیگر میتوانید به کیبوردهای گسترده تر هم دسترسی داشته باشید.

البته درست است که کیبورد شما گزینه های بسیار بیشتری را نسبت به اطلاعاتی که میتوانید در داخل فرم وارد نمایید دارد, به دلیل اینکه کیبورد میتواند چند منظوره باشد; شما نمیتوانید برای هر اطلاعاتی که قرار است در داخل فرمی وارد نمایید از یک کیبورد متفاوت استفاده نمایید.

بنابراین تمامی این مواردی که در بالا به آن اشاره شد یک مشکل جدی را برای شما به وجود می آورد, و آن این است که کاربران وب سایتی که از فرم مربوطه استفاده مینمایند دائما از خود این سوال را میپرسند که آیا اطلاعات وارد شده درست است یا خیر. بنابراین باید به دنبال راهی باشیم تا از این سردرگمی کاربران کم نماییم.

امروزه کیبوردهایی که به صورت لمسی و یا touch هستند میتوانند نسبت به کیبوردهای دیگر گام بسیار بزرگی برای حل این مشکل باشد.

اما تا زمانی که بسیاری از کاربران از کیبوردهای لمسی برای این کار استفاده نمایند, باید به دنبال راه حلی باشیم و یکی از ساده ترین این راه ها استفاده از jquery میباشد, ابزاری که به صورت هوشمندانه بیین کیبورد کاربر و فرم مربوطه قرار خواهد گرفت و تمامی اطلاعات و کاراکترهایی که وارد میشود را میتواند کنترل نماید و کاراکترهایی که خارج از قانون باشد را رد کند و نپذیرد.

در ابتدا لازم داریم که کمی کد HTML برای این کار داشته باشیم:

<fieldset>
<label for="phone">Phone:</label>
<input type="text" id="phone" />
</fieldset>

در مرحله بعدی jquery library را وارد مینماییم

<script type="text/javascript" _REMOVE_></script>

در در پایین همین بخش کد جاواسکریپت مربوطه را قرار میدهیم

<script type="text/javascript">
$(document).ready(function() {
    $('.phoneInput').keypress(function(key) {
        if(key.charCode < 48 || key.charCode > 57) return false;
    });
</script>

$('.surnameInput').keypress(function(key) {
if((key.charCode < 97 || key.charCode > 122) && (key.charCode < 65 || key.charCode > 90) && (key.charCode != 45)) return false;
});

 این مطلب را به اشتراک بگذارید 

برای ارسال نظر وارد سایت شوید
این مورد را ارزیابی کنید
(1 رای)
خواندن 327 دفعه آخرین ویرایش در شنبه, 21 مرداد 1396 00:16
محتوای بیشتر در این بخش: مزایا و معایب زبان jQuery »