پنهان کردن عناصر صفحه در php
من خیلی وقت پیش وقتی داشتم جاوا اسکریپت تمرین می کردم و سعی می کردم اسکریپت های مختلفی با این برنامه نویسی جالب بنویسم ، به یک چالش برخورد کردم. این چالش بررسی خط به خط متن با استفاده از جاوا اسکریپت بود. به همین دلیل امروز در این مطلب می خواهم راه حل این چالش که برای خودم هم پیش آمده را در اختیار شما بگذارم. این مطلب در قالب یک کدَک به شما ارائه می شود.
کاربرد این کدَک
از آنجایی که در وب بسیاری از فرم ها با استفاده از جاوا اسکریپت بررسی می شوند و صحت مقدار های آن ها توسط جاوا اسکریپت تایید می شود ، ممکن است شما بخواهید یک textarea که پر از متن است را بررسی کنید. این textarea می تواند متونی چند خطی داشته باشد و شما باید بتوانید هر خط را بررسی کنید. مثلا شاید بخوانید در متن خود ، خطی که دارای کلمه ی "ایمیل" است را پیدا کنید تا بتوانید ایمیل کاربر را شناسایی کنید یا ...
ابزار آزمایش کد های وب (برای راحتی کار خود از این ابزار استفاده کنید):
مراحل بررسی خط به خطر متن با جاوا اسکریپت
برای این کار شما باید ابتدا یک اسکریپت ایجاد کنید. من نام این اسکریپت را line-reader.js می گذارم. این فایل به شکل زیر است:
<<<code>>>
function readLines( textId )
{
var text = document.getElementById(textId).value,
text_array = text.split("\\n");
return text_array; // برگرداندن مقدار
}
<<</code>>>
توضیح: در تابع بالا که یکی از توابع فایل جاوا اسکریپت ماست که آی دی textarea مورد نظر ما را می گیرد (textId) و با استفاده از این آی دی مقدار textarea را در متغیر text ذخیره می کند. در قسمت بعد با استفاده از متد split (متد پیشفرض جاوا اسکریپت برای تبدیل رشته به آرایه) متن دریافت شده را از قسمت های n\\ می شکند. در نهایت این مقدار که در متغیر text_array ذخیره می شود بازگردانده می شود.
توضیح درباره ی قسمت آبی رنگ: مقدار n\\ نمایانگر یک خط پایین تر (new line) است. (با کلید اینتر ایجاد می شود) توجه داشته باشید که این مقدار حتما باید بین " (دابل کتیشن) باشد.
<<<code>>>
function searchInLines( textArray , forSearch )
{
for( var word in textArray )
{
if( textArray[word].indexOf(forSearch) > -1 )
return word;
}
}
<<</code>>>
توضیح: در این تابع که برای پیدا کردن متن در خط ها به وجود آمده است ، ابتدا دو مقدار دریافت می شود. مقدار textArray که همان مقدار بازگشتی از تابع قبلی است دریافت می شود. ( این مقدار آرایه ای است از خط های متن )
مقدار دوم (forSearch) کلمه یا عبارتی است که ما در متن به دنبال آن هستیم.
این تابع با دریافت این دو مقدار ، ابتدا حلقه ای را به تعداد اعضای textArray تکرار می کند و در هر بار اجرای حلقه بررسی می کند که آیا مقدار مورد نظر ما (forSearch) در این خط وجود دارد یا نه. اگر وجود داشته باشد ( یعنی مقدار بازگشتی از متد indexOf مقداری به غیر از -1 باشد. )
در نهایت عدد خطی که در آن عبارت مورد نظر ما وجود داشته است از تابع بازگردانده می شود. دقت کنید که عدد خطوط از صفر شروع می شود چون در آرایه های این گونه است. (یعنی اولین خط = 0)
توضیح درباره ی قسمت آبی رنگ: شاید این قسمت برای بعضی ها نا آشنا باشد. این مقدار دقیقا معادل مقدار زیر است. در اصل این روش برای بررسی تمام اعضای یک آرایه کاربرد دارد.
<<<code>>>
var word = 0 ; word < textArray.length ; word++
<<</code>>>
کار ما با کد های جاوا اسکریپت تمام است و الان فقط لازم داریم تا این کد ها را در یک فایل اچ تی ام ال امتحان کنیم تا طرز کار آن ها را ببینیم. پس فایلی با نام index.html ایجاد می کنیم و فرمی برای آن می نویسیم:
<<<code>>>
<script type="text/javascript" src="line-reader.js"></script> <!-- وارد کردن فایل جاوا اسکریپت -->
<form onsubmit="return false;">
<textarea id="testText"></textarea>
<input type="submit" onclick=" alert( searchInLines( readLines('testText'), 'عبارت دلخواه' ) ); " />
</form>
<<</code>>>
در قسمت آبی رنگ من در قسمت onsubmit فرم مقدار return false را قرار داده ام که اطلاعات فرم ارسال نشود تا جاوا اسکریپت وقت داشته باشد و مقادیر را ببرسی کند. برای بهتر متوجه شدن این موضوع ، یک بار این مقدار را پاک کنید و نتیجه را آزمایش کنید.
حال می توانید نتیجه ی نهایی را در لینک زیر مشاهده کنید:
کدک انیمیشن لینک های داخلی صفحه 
کدک جعبه ی اطلاعات مطلب 
کد بررسی وجود یک آدرس وب در php 
آموزش استفاده از افزونه جاوا اسکریپت wow 
اجرای انیمیشن css با حرکت اسکرول 
کدَک ایجاد آیکون کوچک سایت (favicon) 
کدَک نمایان و مخفی کردن شی 
کدَک اسلایدر ساده ی پس زمینه 
کدَک غیر فعال کردن انتخاب متن صفحه با css 
کدَک پس زمینه ی چشمک زن 
کدَک نمایش پیغام با ورود به سایت 
کدَک تغییر پس زمینه ی سایت و وبلاگ 
قالب ورود و عضویت در سایت به سبک ویندوز 10
قالب تماس با ما ریسپانسیو برای رزبلاگ
قالب تفریحی گرافیکی برای رزبلاگ
آموزش سریع جاوا اسکریپت - دریافت ورودی از فرم
ایجاد خودکار لینک داخلی عناوین صفحه
انواع سیستم عامل و ماشین
تعریف سیستم عامل
آموزش سریع جاوا اسکریپت - دریافت ورودی
آموزش سریع جاوا اسکریپت - شروع کد نویسی
آموزش سریع جاوا اسکریپت - مفاهیم پایه
قالب سایت ابر دانلود برای رزبلاگ
بنر تلگرام جذب اعضا full css
قالب حرفه ای گرافیکی برای رزبلاگ
آموزش ایجاد چرخش مداوم با css
معرفی چند باگ معروف و پچ آن ها در php
آموزش ساخت تصویر تصادفی امنیتی در php
آموزش C# قسمت پنجم | انواع عملگر ها
قالب واکنشگرای حرفه ای برای رزبلاگ 
ویژگی Position در Css و مقادیر آن
ضدهک کد های جاوا اسکریپت
ابزار پیشرفته ی آزمایش کد های وب (دمو ساز)
نقشه ی سایت چیست؟
شیوه ی خط افقی - طرح آبی
قالب 404 شماره 1 - طرح ساده با تصویر زیبا
فایل روبات چیست؟
شيوه ي ارسال ديدگاه براي مطالب رزبلاگ - حتما ببینید
ابزار نمایش تصاویر تصادفی طبیعت
پروژه ی آماده ی تبدیل مبنای 2 به 10
قالب فوق العاده ی فلت طرح گرافیک