کار کردن با فرم ها

[سعید شعبانی 2047]

سلام

در این تاپیک من چند مطلب در مورد فرم ها می خواهم بدونم

1- چجوری یک متن را می توان در یک فرم قرار داد "مانند فرم جستجوی همین انجمن" تا زمانی که متنی را در فرم نوشته نشده است کلمه جستجو پیدا باشد و بعد از پاک کردن متن نیز دوباره کلمه پیدا شود.

2- چگونه دکمه جلوی فرم را به داخل فرم بیاوریم؟

3- برای فرم هایی که قبلا متن هایی را در آن وارد کرده ایم چگونه استایل مشخصی قرار دهیم؟

[Morteza 34190]

1- بکمک جاوااسکریپت میشه. در html5 هم این خاصیت پیش فرض وجود داره.

<input type="text" name="s" id="search-input" value="جستجو کنید..." onclick="this.value = ''" onblur="this.value = 'جستجو کنید...'"/>

2- با استایل و margin منفی دادن اینکار انجام میشه.

3- متوجه نشدم! بیشتر توضیح بدید

[سعید شعبانی 2047]

1- بکمک جاوااسکریپت میشه. در html5 هم این خاصیت پیش فرض وجود داره.

<input type="text" name="s" id="search-input" value="جستجو کنید..." onclick="this.value = ''" onblur="this.value = 'جستجو کنید...'"/>

من از این کد در بخش نظرات پستها استفاده کردم ولی مشکلی که وجود داره این هست که زمانی که در فرم ها متنی رو می نویسم بعد از خروج از فرم متن دوباره به متن پیش فرض تغییر پیدا می کند.

نمونه : http://dnoj.ir/post/%D8%A8%D8%A7-%DA%A9%DB%8C%D9%88%D8%A8%D9%84%D8%AA-%D9%87%D8%A7-%D8%B1%D8%A8%D8%A7%D8%AA-%D8%AE%D9%88%D8%AF%D8%AA%D8%A7%D9%86-%D8%B1%D8%A7-%D8%A8%D8%B3%D8%A7%D8%B2%DB%8C%D8%AF.html

3- متوجه نشدم! بیشتر توضیح بدید

مانند این تصویر

ویرایش شده دی 91 توسط سعید شعبانی

[Morteza 34190]

بنظر از مرورگر هست من مشکلی ندیدم!

[سعید شعبانی 2047]

بنظر از مرورگر هست من مشکلی ندیدم!

من با ie هم چک کردم مشکل داره منظور من بخش نظرات هست نه جستجو !

[Morteza 34190]

به اینصورت تست کنید:

<input type="text" name="s" id="search-input" value="جستجو کنید..." onclick="this.value = ''"/>

[سعید شعبانی 2047]

درست شد. فقط در بخش متن نظرات هم من از همین کد استفاده کردم ولی برای اون تا زمانی که کلیک در فرم نکنم نوشته پیشفرض نشون داده نمیشه و البته بعصی از مواقع هم نوشته ای که می نویسم پاک میشه!

این هم کدش

<textarea name="comment" value="نظر شما چیست" onclick="this.value = ''" class="textarea" rows="10" cols="50" tabindex="4"></textarea>

بروز شده :

placeholder="your text"

آقا مرتضی این کد رو همین الان از سایت css-tricks.com پیدا کردم. با این کد دیگه لازم به استفاده از کد های بالا نیست.

ویرایش شده دی 91 توسط سعید شعبانی

[Morteza 34190]

این کد پیش فرض برای html5 هست و در مرورگرهایی که html5 ساپورت نیستن کلا کار نمیکنه.

[سعید شعبانی 2047]

این کد پیش فرض برای html5 هست و در مرورگرهایی که html5 ساپورت نیستن کلا کار نمیکنه.

کدوم ورژن مرورگر ها از html5 پشتیبانی می کند؟

[Morteza 34190]

بجز نسخه های 10 به پایین ie بقیه همه پشتیبانی میکنن