i
در حال برنامه نویسی و آماده سازی نسخه جدید «وبگو» هستیم، در این نسخه قابلیت ها و ظاهر سایت به کلی متفاوت و کاملتر خواهد بود، این فرآیند زمانبر و از مدتی پیش شروع شده و همچنان ادامه دارد، روند پیشرفت پروژه در این قسمت به صورت درصدی مشخص است و به تناوب به روزرسانی می شود.
نکته:
با توجه به تاریخ نگارش آموزش های سایت و پیشرفت تکنولوژی های مرتبط با وب در سالیان اخیر، محتوای برخی از مطالب قدیمی ممکن است نیاز به ویرایش و به روزرسانی داشته باشند که این کار هم زمان با تهیه نسخه جدید «وبگو» به مرور در حال انجام است، لطفا در استفاده از مطالب سایت به این نکته دقت داشته و حتی المقدور از چند منبع مختلف استفاده نمائید.
article

شروعی بر برنامه نویسی جاوا اسکریپت (JavaScript)

javascript

یکی از زبان های انعطاف پذیر و در عین حال قدرتمندی که در کنار تگ های ساده HTML و استایل CSS مورد استفاده برنامه نویسان وب قرار می گیرد، زبان برنامه نویسی جاوا اسکریپت (JavaScript) است، البته شاید تصورمان از شنیدن عنوان جاوا اسکریپت بیشتر معطوف به کدهای کاربردی وبلاگ ها و سایت ها شود، اما در واقع باید گفت قدرت این زبان برنامه نویسی خیلی بیشتر از نمودهای ظاهری است که می بینیم و احیانا به عنوان مدیر وبلاگ یا سایت با آنها سر و کار داریم، در دنیای حرفه ای بیشتر سایت ها و صفحات وب برای ایجاد انواع قابلیت های تعاملی سمت کاربر، بررسی اعتبار فرم ها، ارتباط با سرور، شناسایی قابلیت های مرورگر کاربران، کار با کوکی ها (Cookie) و مواردی از این دست از جاوا اسکریپت استفاده می کنند، البته با همه این تفاسیر به دلیل سمت کاربر (Client-side) بودن این زبان (یعنی جاوا اسکریپت تنها روی مرورگر کاربران قابل اجراست و برای تفسیر آن از مفسر مرورگر استفاده می شود نه سرور سایت)، در عین قدرتمندی محدودیت هایی نیز وجود خواهد داشت که جزء ویژگی های ذاتی هر زبان برنامه نویسی محسوب می شود.

اهمیت آموزش جاوا اسکریپت و چند مثال


همان طور که اشاره شد فراگیری جاوا اسکریپت جهت تکمیل روند آموزش مهارتهای برنامه نویسی وب گام سوم محسوب می شود، یعنی پس از آشنایی و تسلط بر HTML و CSS، نیاز به یک زبان اسکریپت نویسی تعاملی داریم تا بتوانیم با قدرت بیشتری صفحات وب خود را خلق نمائیم، این زبان اسکریپتی در وب همان جاوا اسکریپت است که البته کاربرد آن منحصر به وب نیست و گستره وسیعی دارد، منظور از اسکریپتی بودن جاوا اسکریپت این است که این زبان صرفا در مرورگر تفسیر (Interprete) شده و توسط ماشین کامپایل (Compile) نمی شود، با توجه به اهمیت درک ساختار و نحوه عملکرد جاوا اسکریپت و گستره وسیع استفاده از آن، اغلب به علاقمندان برنامه نویسی توصیه می شود این زبان را در کنار سایر زبان های تخصصی مورد نظرشان بیاموزند تا در نوشتن و فهم الگوریتم های پیچیده ورزیده شوند!، برای شروع آموزش های این قسمت، بد نیست یک مثال از قابلیت های اسکریپت نویسی این زبان را بررسی کنیم، در زیر کدی ساده را جهت نمایش یک هشدار در پنجره مرورگر درج کرده ایم.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>وبگو | ایجاد یک هشدار در جاوا اسکریپت</title>
<!-- Webgoo.ir -->
<style type="text/css">
body{
    font-family:Tahoma, Geneva, sans-serif;
    text-align:justify;
    font-size:12px;
    direction:rtl;
}
</style>
<script type="text/javascript">
//نمایش یک پیام
window.alert("سلام! این یک پیام جاوا اسکریپت است");
</script>
</head>
<body>
<noscript>
جاوا اسکریپت در مرورگر شما غیر فعال است!
</noscript>
<hr>
کدهای جاوا اسکریپت بین تگ script نوشته می شوند.
</body>
</html>
پیش نمایش
همانطور که می بینیم شیوه نوشتاری (Syntax) این زبان به طور کلی به صورت زیر است:
object.method(argument1, argument2);
آبجکت ها در جاوا اسکریپت می توانند به طور مثال document یا window و متد نیز به فرض write، alert باشند، در صورتی که با این مفاهیم (آبجکت، متد) آشنایی قبلی ندارید جای نگرانی نیست، در این مرحله نیازی به درک عمیق این مفاهیم نیست و همین که بدانیم چگونه از نمونه کدها مطابق با نیازمان پیروی کنیم، کافی خواهد بود!

مثالی دیگر با جاوا اسکریپت


همانطور که گفتیم، کدهای جاوا اسکریپت توسط مفسر مرورگر اجرا یا به عبارت صحیحتر تفسیر (Interprete) می شوند، لذا ویژگی هایی مانند تاریخ یا زمان، مبتنی بر تاریخ و زمان مرورگر و در واقع تاریخ و زمان سیستم عامل خواهند بود، مثالی برای ایجاد یک متن همراه تاریخ (در جاوا اسکریپت نیز مانند CSS می توان دستورات را به شکل یک فایل خارجی در صفحه وارد کرد، کدهای این مثال نیز از یک فایل خارجی در صفحه ایمپورت شده اند):
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>وبگو | ایجاد یک پاراگراف در جاوا اسکریپت</title>
<!-- Webgoo.ir -->
<script type="text/javascript" src="docwrite.js"></script>
<style type="text/css">
body{
    font-family:Tahoma, Geneva, sans-serif;
    text-align:justify;
    font-size:12px;
    direction:rtl;
}
</style>
</head>
<body>
<noscript>
جاوا اسکریپت در مرورگر شما غیر فعال است!
</noscript>
<hr>
کدهای این صفحه به صورت یک فایل خارجی ایمپورت شده است.
</body>
</html>
کد ایمپورت شده در صفحه:
document.write("کد جاوا اسکریپت، ایجاد یک پاراگراف و نمایش تاریخ:<br>");
document.write("<p>" + Date() + "</p>");
پیش نمایش
توضیح:
- همان طور که اشاره شد، کدهای جاوا اسکریپت را می توان به صورت فایل خارجی نیز در صفحه ایمپورت کرد، اغلب برای کاهش حجم صفحات وب و افزایش سرعت بارگذاری، دستورات جاوا اسکریپت را تا حد امکان در یک یا چند فایل تجمیع کرده و در صفحه درج می کنند.
- توصیه می شود کدها را بین تگ head قرار دهید مگر در مواردی که نیاز باشد آنها را در انتهای صفحه یا در قسمت دیگری درج نمائید، البته این توصیه بیشتر برای مواقعی است که به فرض یک فایل یا کتابخانه حجیم را در صفحه وارد می کنید.
- Date یک تابع درونی جاوا اسکریپت است (یعنی این تابع و ویژگی های آن از قبل در مفسر تعریف شده)، از تابع Date برای موارد مربوط به تاریخ و زمان استفاده می شود (در آموزش های پیش رو در این رابطه بیشتر خواهیم گفت).
- از تگ noscript برای نمایش پیام هشدار به کاربر در صورت فعال نبودن جاوا اسکریپت در مرورگر استفاده نمائید، اگرچه در اغلب مرورگرها امکان جاوا اسکریپت جزء ملزومات اولیه بوده و به صورت پیش فرض فعال است، اما ممکن است به دلایلی خواسته یا ناخواسته این امکان غیرفعال شده باشد، پس بهتر است با نمایش یک پیام هشدار، کاربر را نسبت به این موضوع آگاه کنیم.
sectionدسته بندی: آموزش مقدماتی » JavaScript
related مطالب بیشتر:
» حلقه for و while در جاوا اسکریپت (JavaScript)
» متغیرها، محاسبات و عملگرها در جاوا اسکریپت (JavaScript)
» کار با پنجره pop up در جاوا اسکریپت (JavaScript)
» کار با تاریخ و زمان در جاوا اسکریپت (JavaScript)
» توابع (Functions) در جاوا اسکریپت (JavaScript)
commentنظرات (۷۲ یادداشت برای این مطلب ارسال شده است)
نویسنده: مهدی
زمان: ۱۶:۳۳:۲۹ - تاریخ: ۱۳۹۱/۰۹/۲۴
سلام کدی هست با جاوا یا هرچی که بشه اسکرول مرورگر رو حذف کرد تو طراحی ؟
پاسخ: 
اگر منظور شما حذف نوار اسکرول مرورگر به طور کلی است، خیر، چنین چیزی در وب امکان پذیر نیست، اما اگر منظور جلوگیری از اسکرول شدن صفحه است، چند روش وجود دارد، در جاوا اسکریپت می توانید از کد نمونه زیر استفاده کنید:
window.onscroll = function (){
window.scrollTo(0, 0);
};
البته این شیوه استاندارد نیست و ممکن است در برخی مرورگرها هنگام اسکرول پرش داشته باشید.
در css هم می توانید برای عناصر body و html مقادیر hidden را برای overflow در نظر بگیرید:
<style type="text/css">
html, body {
overflow: hidden;
}
</style>
در کل اگر لازم است، بهتر است صفحاتی طراحی کنید که ارتفاع آنها از ارتفاع صفحه نمایش تجاوز نکند تا اسکرول هم نداشته باشید.
نویسنده: amirchermahini
زمان: ۱۲:۰۵:۳۸ - تاریخ: ۱۳۹۱/۱۲/۲۲
سلام و عرض ادب و احترام
با تشکر از اموزشهای خوب و عالی شما
سوال
چرا وقتی اولین اموزش جاوا رو مینویسم مثل دموی اموزشی شما نمیشه و اون پنجره کوچولو باز نمیشه که نوشته روش
(سلام ! این یک پیام جاوا اسکریپت است)
منظورم پنجره alert هستش
در صورت امکان راهنمایی بفرمایین
با تقدیر و تشکر از لطف شما عزیز در خصوص گرداوری مطالب فوق العاده
پاسخ: 
سپاس از نظر لطف شما، در رابطه با مشکلی که مطرح کردید، اگر دقیقا نمونه کد را در یک فایل با پسوند html قرار داده و آن را اجرا کنید، نباید مشکلی باشد، مگر در مورد مرورگرهایی مانند اینترنت اکسپلورر که به صفحات آفلاین (صفحاتی که از روی هارد دیسک فراخوانی می شوند) اجازه اجرای جاوا اسکریپت را نمی دهد و باید این اجازه را به صورت دستی به صفحه بدهید.
نویسنده: amirchermahini
زمان: ۱۹:۲۴:۰۱ - تاریخ: ۱۳۹۱/۱۲/۲۲
باز هم سلام وعرض ادب
ممنونم بخاطر راهنمایی شما
من با سه مرورگر فایر فاکس کروم و اپرا امتحان کردم ولی جواب نداد متاسفانه
من واقعا علاقه زیادی دارم به این مباحث و اگر اجازه بفرمایین میخوام از روی مطالب شما اموزش جاوا رو شروع کنم یه اندکی به تازگی با html و css هم شروع کردم و از روی سایت اسا رایان کار کردم اما تازه سایت شما رو زیارت کردم و از اینکه جاوا و زبانهای دیگه هم اموزش میدین واقعا خوشحالم چون میخوام از پایه روی همه شون کار کنم
و خواهش میکنم در صورت امکان منو راهنمایی بفرمایین
تا یه استارت از پایه بزنم و اگه امکان داره یه اموزش خیلی مبتدیانه
پاسخ: 
کدهای آموزش تست شده اند، برای بررسی بیشتر فایل خود را از طریق آدرس ایمیل (در بخش تماس با ما وجود دارد) ارسال کنید تا مشکل مشخص شود.
در مورد آموزش ها، البته زبان جاوا با جاوا اسکریپت کاملا متفاوت است (جاوا اسکریپت زبان اسکریپت نویسی برای وب است، اما جاوا جهت نوشتن برنامه های کاربردی برای پلتفرم های مختلف مانند کامپیوترها، موبایل ها و... کاربرد دارد)، به هر صورت در اموزش ها سعی شده مباحث تا حد امکان ساده و قابل فهم باشند، اما اگر مشکلی بود می توانید مطرح کنید.
نویسنده: amirchermahini
زمان: ۲۰:۱۷:۱۶ - تاریخ: ۱۳۹۱/۱۲/۲۲
باز هم سلام و عرض ادب واحترام
استاد عزیزم از زحماتی که توی این روز اول بشما دادم واقعا عذر میخوام و از زحماتی هم که در خصوص جوابها و راهنمایی های شما واقعا ممنونم و سپاسگذار
جاوا فعال شد اون چند دفعه به علامت " " توجه نمی کردم اما همین که گذاشتم درست شد
ولی یه سوال من اگه بخوام وقتی وارد صفحه اول سایتم میشم یه خوشامد گویی بذارم به این شکل
این کدها را دقیقا به همین شکل باید توی صفحه اصلی ذخیره کنم ؟
پاسخ: 
خیر، مثال ها تنها یک نمونه هستند که نشان می دهد چگونه می توانید از جاوا اسکریپت در تگ های HTML استفاده کنید، قسمت HTML نیاز نیست، کافی است موارد مربوط به دستورات جاوا اسکریپت را قرار دهید.
نویسنده: ehsan
زمان: ۱۸:۱۷:۴۵ - تاریخ: ۱۳۹۱/۱۲/۲۴
سلام
من میخوام جدول لیگ برتر در این سایت رو در سایت خودم نمایش بدم.
http://www.varzesh3.com/leaguecomshow.do?lang=en&machesid=standing90-900076-900181-full
با php اومدم فایل رو ضمیمه کردم و قسمت های دیگه که نمی خواستم رو پنهان کردم.
میخواستم ببینم روش بهتری هم هست؟ چون اون روش باعث سنگینی سایت میشه.
پاسخ: 
روش دیگر دریافت اطلاعات صفحه با استفاده از توابعی مانند file_get_contents و تجزیه تگ ها با عبارات باقاعده (regular expression) و تابع preg_match است.
نویسنده: آرش
زمان: ۲۰:۲۴:۳۷ - تاریخ: ۱۳۹۲/۰۲/۲۷
سلام
میخوام کوکی ای که ساختم مقدارش در سرور سایت ذخیره و فراخوانی بشه نه در browser اگه ممکنه راهنمایی کنید
پاسخ: 
ذخیره نشدن کوکی در مرورگر با فلسفه آن تناقض دارد و با این کار استفاده از کوکی هیچ فایده ای نخواهد داشت! به هر حال برای هدف فوق باید از برنامه نویسی سمت سرور مانند PHP یا ترکیب سمت کاربر و سمت سرور مانند Ajax استفاده کنید و مقادیر کوکی را در دیتابیس یا به صورت فایل در سرور ذخیره نمائید.
نویسنده: خلیل
زمان: ۲۲:۴۹:۴۵ - تاریخ: ۱۳۹۲/۰۷/۲۶
مرسی از زحماتتون .
اگه میشه ایمپورت کردن جاوا را کامل توضیح بدین خیلی ممنون میشم . من تا این حد فهمیدم که یه فایل رو با کد جاوا و با پسوند js میسازیم و در کدی که مینویسیم برای مثال :
<script type="text/javascript" src="docwrite.js"></script>
در خصوصیت src ادرس همون فایلی که درست کردیم رو میدیم . ایا درست فهمیدم یا .. اگه میشه راهنمایی کنین .
پاسخ: 
توضیح شما برای ایمپورت فایل js خارجی کامل بود، یک روش دیگر نیز درج کدها در همان صفحه است، مثال:
<script type="text/javascript">
alert('JavaScript is powerful!');
</script>
نویسنده: ابوالفضل
زمان: ۱۳:۵۱:۲۰ - تاریخ: ۱۳۹۲/۱۰/۱۱
سلام بسیار ممنونم از سایت خیلی خوبتون و کمک هایی که به ما کاربران می کنید من مطالب سایتتون رو دارم دنبال می کنم خیلی آموزنده هست اکنون با یک مشکلی برخورد کرده ام
من می خوام زمانی که در تکست باکس متنی تایپ می شود همان زمان اون متن در تکست باکس دیگری هم نوشته شود لطف کنید کمکم کنید
بازم ممنون
پاسخ: 
هر چند که باید آموزش های مقدماتی را دنبال کنید و خودتان کدها را بنویسید، با این حال:
<script type="text/javascript">
function setText(id, value){
document.getElementById(id).value = value;
}
</script>
<input type="text" onkeyup="setText('test', this.value)"><br>
<input type="text" id="test">
نویسنده: بهنام
زمان: ۱۷:۴۹:۰۹ - تاریخ: ۱۳۹۲/۱۲/۱۶
سلام
<form method="post" name="myform">
<input onchange="Pm();" onblur="Pm();" onfocus="Pm();" class="mmm" type="text" name="chat" />
</form>
<script type="text/javascript">
function Pm(){
if(myform.chat.value == 'a'){
alert('');
myform.chat.value = '';
}
}
</script>
بنده کد رو نوشتم میخوام وقتی که درون فیلد کلمه هایی که کاربر تایپ میکنه از نظر کلمات زشت یا هر چی سانسور بشه مثلا یه پنجره پیام نمایش بده لطفا این پیام رو تایپ نکنید سپس فیلد خالی بشه اما اینی که من نوشتم در صورتی عمل میکنه که تنها فقط همون کلمه باشه این عملیات انجام میشه ولی من میخوام در هر قسمت چه اول چه آخر و حتی وسط متن ها تایپ کرد این عملیات انجام بشه
مثلا کلمه ی 'نوچ' سانسور بشه اگر در فیلد همچین چیزی را تایپ کرد
من بهنام از سایت نوچ هستم
لطفا کدی را برام بنویسید ممنون میشم
پاسخ: 
می توانید از دستورات عبارات با قاعده استفاده کنید، نمونه کد:
<script type="text/javascript">
function Pm(){
var regex = new RegExp(/([\s\S]*?)(کلمات|مورد|نظر)(( )+([\s\S]*?)|$)/ig);
if(myform.chat.value.search(regex) != -1){
alert('عبارت غیر مجاز!');
myform.chat.value = '';
}
}
</script>
در دستور بالا اگر کلمه وارد شده دقیقا مطابق با کلمات مورد نظر باشد (بدون حروف اضافه در ابتدا یا انتها) بررسی true خواهد شد، همچنین دستور طوری نوشته شده که فضای خالی برای کلماتی که در انتها قرار دارند در نظر گرفته نشود.
نویسنده: بهنام
زمان: ۱۹:۲۹:۱۵ - تاریخ: ۱۳۹۲/۱۲/۱۶
سلام
چطور میشه جاوا اسکریپت و پی اچ پی را این مدلی با هم ترکیب کرد به صورتی که اگه شرط جاوا اسکریپت درست بود کد های پی اچ پی عمل کنند ولی اینی که بنده نوشتم دستورات جاوا اسکریپت نادیده گرفته می شوند و کد های پی اچ پی با ریفرش شدن صفحه عمل می کنند و شرط نادیده گرفته می شود
<script type="text/javascript">
var name = prompt('نام شما در چت روم','');
//اگر فیلد پنجره را خالی نگذاشت و کنسل را نزد
if(name != '' && name != null){
<?php
$_SESSION['name'] = 'name';
?>
}else{
alert('لطفا یک اسم وارد کنید');
window.location.href = '';
}
</script>
لطفا کد را تصحیح کنید با تشکر
پاسخ: 
PHP زبان سمت سرور است و نمی تواند منتظر دستورات جاوا اسکریپتی باشد! به محض اجرای صفحه دستورات در سرور پردازش شده و خروجی ارسال می شود، در واقع خروجی به صورت HTML است و در سورس مرورگر اثری از PHP نمی بینید! راه حل این است که یا از Ajax استفاده کنید، یا اینکه سیستم ورود متداول تری داشته باشید، به فرض با استفاده از فرم HTML معمولی و ارسال اطلاعات به فایل PHP، روش دیگر ست کردن کوکی با جاوا اسکریپت است.
نویسنده: بهنام
زمان: ۲۳:۱۱:۳۷ - تاریخ: ۱۳۹۲/۱۲/۱۶
var name = prompt('نام شما در چت روم','تعداد کاراکتر های مجاز 15 تا میباشد');
if(name != '' && name != null && name.length <= 15){
xmlhttp.onreadystatechange = function(){
if(xmlhttp.readyState == 4 && xmlhttp.status == 200){
document.getElementById('main').innerHTML = xmlhttp.responseText;
}
}
xmlhttp.open('POST','ajaxphp.php',true);
xmlhttp.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
xmlhttp.send('ok=mgprotpaqomdptq&name='+name);
window.location.href = '?chat';
}else{
alert('لطفا یک اسم کمتر از 15 کاراکتر وارد کنید');
window.location.href = '';
return false;
}
خیلی ممنون راجع به سوال آخری مشکلم همین بود که بعد از فرستادن آژاکس
xmlhttp.send('ok=mgprotpaqomdptq&name='+name);
صفحه ریفرش بشه اما فقط در مرورگر گوگل کروم کار میکنه و در مرورگر فایرفاکس صفحه ریفرش میشه و آژاکس ارسال نمیشه ولی در گوگل کروم ارسال میشه
اما اگه پایینش این کد رو نذاری تو همه مرورگر ها آژاکس ارسال میشه
window.location.href = '?chat';
ولی من واقعا نیاز دارم که این رو بزارم
و در فایل ajaxphp.php این کد ها موجود هست
<?php
session_start();
@$name = $_POST['name'];
@$ok = $_POST['ok'];
if($name != '' && $ok == 'mgprotpaqomdptq' && strlen($name) <= 15){
$_SESSION['name'] = $name;
}
?>
پاسخ: 
می توانید در قست زیر دستور رفرش را اجرا کنید:
if(xmlhttp.readyState == 4 && xmlhttp.status == 200)
این قسمت زمانی که درخواست ارسال و پاسخ دریافت شده باشد اجرا می شود (البته مشخص نیست هدف شما چیست، چه لزومی دارد که به محض دریافت پاسخ، صفحه رفرش شود و اطلاعات از دست برود؟!)
نکته: اگر هیچ کدام از روش های بالا جوابگو نبود، از تابع setTimeout برای ایجاد وقفه استفاده کنید.
نویسنده: بهنام
زمان: ۲۰:۵۶:۱۲ - تاریخ: ۱۳۹۲/۱۲/۱۸
سلام
هدف من این است که با ارسال آژاکس یک سشن ذخیره شود و محض ذخیره شدن سشن صفحه ریفرش شود و گفته بودم اگه سشن چک شد یک چیزی را نمایش دهد و حتما باید صفحه ریفرش شود ممنون از اینکه کمکم کردین بی نهایت تشکر می کنم از سایت مفیدتون امیدوارم همیشه در مراحل زندگیتون سربلند باشید با تشکر
نویسنده: بهنام
زمان: ۰۰:۱۶:۲۰ - تاریخ: ۱۳۹۲/۱۲/۲۷
سلام بازم تشکر از این که تمام سوالات من رو جواب میدین بی نهایت ممنونم
یه سوالی داشتم
چطوری میتونم نوع title یک لینک را عوض کنم مثلا وقتی ماوس روی یک لینک یا یه عکسی که میرود یه توضیحاتی درج میشود
<a title=""><img title="" />
میخوام آن توضیحاتی که درون یه کادر ظاهر میشه میخوام استایل بدم مثلا رنگ زمینه شو مشکی کنم یا انیمشن کنم که بخوام متن درونش حرکت کنه این با چه نوع برنامه نویسی امکان دارد سی اس اس یا جاوا اسکریپت ؟ یا جی کوئری؟
لطفا نمونه ش را برام نشون بدین ممنون میشم
پاسخ: 
بسته به سطح توقع شما از این امکان (که Tooltip نام دارد) می توان با ترکیب جاوا اسکریپت و CSS و یا ترکیب جی کئوری و CSS آن را ساخت، در تئوری رویداد onmouseover و onmouseout در جاوا اسکریپت بدین منظور به کار می روند، در هر صورت ساخت این ابزار نیازمند توضیحات زیادی است که شرح همه آنها در اینجا ممکن نیست، با یک جستجوی ساده در وب نمونه های زیادی وجود دارد.
نکته 1: با کمی آشنایی با جاوا اسکریپت و متدهایی مانند document.getElementById و همچنین آشنایی با نحوه ساخت بلاک ها به صورت position absolute و relative می توانید خودتان این امکان را به نحو سفارشی بنویسید.
نکته 2: عنصر اصلی یا دکمه شما (که همان بلاک والد با خاصیت relative است) باید با بردن ماوس روی آن، بلاک فرزند را با کدهای جاوا اسکریپت نمایش دهد و با خارج شدن ماوس، بلاک فرزند مخفی گردد.
نویسنده: بهنام
زمان: ۰۱:۴۴:۲۸ - تاریخ: ۱۳۹۲/۱۲/۲۸
سلام
یه سوالی داشتم در مورد اسکرول مرورگر
میخوام بدونم چطوری میشه مثلا من یه div دارم 500 در 500 پیکسل و ارتفاع رو overflow:auto میگیرم و با آژاکس درون فیلد یه متنی رو ارسال میکنی در اونجا نمایش داده میشه وقتی که پر میشه اسکرول ظاهر میشه و آخرین پیامی که میده اسکرول اول میمونه میخوام اسکرول ریفرش صفحه در آخر باشه یه پیام که ارسال میشه اسکرول بیاد آخر و آخرین پیام ارسالی رو نمایش بده، یه تست زدم خودم ولی کار نکرد نمونه کد:
<script type="text/javascript">
function goTo(id){
var elm = document.getElementById(id);
elm.scrollTop = elm.scrollHeight;
}
</script>
<a href="#" onclick="goTo('behnam'); return false;">رفتن به پایین</a>
<div id="behnam" style="background-color:#000;height:100px;width:200px;color:white;overflow:auto;">متن پیام آزمایشی متن پیام آزمایشی متن پیام آزمایشی متن پیام آزمایشی متن پیام آزمایشی متن پیام آزمایشی متن پیام آزمایشی متن پیام آزمایشی متن پیام آزمایشی متن پیام آزمایشی متن پیام آزمایشی متن پیام آزمایشی متن پیام آزمایشی متن پیام آزمایشی</div>
پاسخ: 
نمونه کدتان (در بالا) ویرایش شد!
نویسنده: بهنام
زمان: ۱۴:۱۲:۳۴ - تاریخ: ۱۳۹۲/۱۲/۲۹
سلام
لطفا توضیح دهید من چیزی نفهمیدم !
اگه همین کد را بخوام رفتن به بالا کنم چه طوری میشه؟
<script type="text/javascript">
function goTo(id){
var elm = document.getElementById(id);
elm.scrollBottom = elm.scrollHeight;
}
</script>
ایا این گونه ؟
این کدی که دادین در اکپسلور کار نکرد
پاسخ: 
برای اسکرول به بالا باید مقادیر elm.scrollTop را 0 قرار دهید، کد در اکسپلورر تست شده، ممکن است به صورت آفلاین صفحه را اجرا کرده باشید و مرورگر کدهای جاوا اسکریپت را بلاک کرده باشد، از چه نسخه ای استفاده می کنید؟
paged صفحه 1 از 5




more لطفا دقت کنید که یادداشت های زیر منتشر نشده و حذف خواهند شد:
- یادداشت های خارج از موضوع این مطلب.
- سوالات کلی، غیر ضروری و مشکلاتی که هیچ تلاشی برای رفع آن نکرده باشید.
- نظرات حاوی کدها و اسکریپت های خیلی طولانی (به طور مثال کد کامل قالب وبلاگ).

7 × 4
 refresh
آگهی
رنگین کمان عکس
Ranginkamaan.com

آرشیو عکس های باکیفیت با موضوعات متنوع...
پرشین آی تی
Persianit.net

آموزش و دانلود پروژه های برنامه نویسی سی شارپ (#C)