سلام امیدوارم روز خیلی خوبی داشته باشید، من امروز میخوام یکم در مورد keypress جی کوئری با همدیگه صحبت کنیم !!
شاید شما نیاز داشته باشید در یک المان ورودی مثل input text یا textarea زمانی که یک دکمه ای اتفاق بی افتد، رویدادی فراخوانی شود و یک عملیاتی برای ما انجام دهد، امروز میخواهیم با هم بررسی کنیم که چگونه میتوانیم یک المان متن input text box را زمانی که دکمه ی Enter زده میشه یک سری عملیاتی دلبخواهی برای ما انجام دهد و یا برود یک ریکوئست به سرور زده و اطلاعات دریافت شده را نمایش دهد.
پس ما با هم دیگه یک کادر جست و جو درست میکنیم که زمانی که کاربر متن خود را برای جست و جو تایپ کرد و دکمه ی اینتر را فشار داد بره یک پیام بده “آره بابا پیداش کردم 😀 ”
خب پس بهتره سریع دست به کار بشیم و با کد زیر میتوانید یک کادر جست و جو در صفحه ی html خود اضافه کنید :
<input id="search" type="text" name="search" placeholder="یک چیزی برای جست و جو تایپ کنید"/>
کد بالا یک کادر جست و جو با آی دی search ایجاد میکند، حالا کد jquery خود را به صفحه اضافه کنید
<script>
$(function(){
$("#search").keypress(function(e){
alert( "آره بابا پیداش کردم ")
});
});
</script>
توضیخ : همان طور که در بالا مشاهده میکنید من المنت search را انتخاب کردم و از متد keypress استفاده کردم ، به این معنی که اگر در کادر جست و جو دکمه ای زده شد رویداد keypress فراخوانی میشود اما اگه همینجوری اجرا بگیرید هر دکمه ای که در کادر جست و جو زده میشه alert() ایجاد میشود و پیام “آره بابا پیداش کردم ” میدهد برای این که تاکید کنید که فقط زمانی که دکمه ی Enter زده شد واکنش نشون بده یک تغییر خیلی کوچولو ایجاد میکنیم و اون یک شرط ساده مبزاریم و بررسی میکنیم که آیا این دکمه که زده شد،دکمه ی اینتر بوده است ؟ ( کد دکمه ی اینتر عدد ۱۳ می باشد )
$(function(){
$("#search").keypress(function(e){
if(e.which == 13){
alert("yup! i found it :) \n here you are ")
}
});
});
برای همین من به این صورت بررسی میکنم که این چه کلیدی است که در کادر جست و جو، زده شده است.
به نظرم تونسته باشم منظور رو برسونم و خیلی ممنون از توجهتون اگه نظری هست خیلی خوشحال میشم به عرض بنده برسونید با تشکر.
نظر شما چیست؟