السلام عليكم
مطلوب كود مربع نص عند الكتابة بداخل المربع في مستعرض الويب يتمدد مع طول النص
على سبيل المثال كتبنا كلمة من 10 أحرف المربع على طول الكلمة فقط بينما عند الكتابة 30 حرف المربع يتمدد تلقائياً على طول النص
بإنتظار خدمتكم وشكراً
السلام عليكم
مطلوب كود مربع نص عند الكتابة بداخل المربع في مستعرض الويب يتمدد مع طول النص
على سبيل المثال كتبنا كلمة من 10 أحرف المربع على طول الكلمة فقط بينما عند الكتابة 30 حرف المربع يتمدد تلقائياً على طول النص
بإنتظار خدمتكم وشكراً
الكود
هذه الخاصية موجودة بـjqueryكود PHP:
<html>
<head>
<script language="JavaScript">
function ResizeTextArea(id,d)
{
var txtBox=document.getElementById(id);
sVal= txtBox.value.length;
if (sVal > d ) { txtBox.cols = (sVal+3);}
}
</script>
</head>
<body>
<textarea onkeydown="ResizeTextArea(this.id,20);" id="txtTest" name="txtTest" cols="20" rows="1" style="overflow-y: hidden;" > </textarea>
</body>
</html>
استخدم الـ jquery وريح راسك اذا ما بتفهم جافاسكربت
__________________
Professional Java?Script Programmer and Web Developer
أشكرك من كلّ قلبي عزيزي
وفقك الله
السلام عليكم ورحمة الله
أخي العزيز شكراً لك على جهودك
بخصوص مربع الكود النصي حصلت معي مشكله بسيطه
عند تكراره في صفحه واحده يصير اول مربع يتمدد فقط بينما البقية لا تتمدد
إذا أمكن تحلّ لي المشكلة
شاكر ومقدر لك تعاونك
=============================================
===================================================كود:<html> <head> <script language="JavaScript"> function ResizeTextArea(id,d) { var txtBox=document.getElementById(id); sVal= txtBox.value.length; if (sVal > d ) { txtBox.cols = (sVal+3);} } </script> </head> <body> <textarea onkeydown="ResizeTextArea(this.id,20);" id="txtTest" name="txtTest" cols="20" rows="1" style="overflow-y: hidden;" > </textarea> </body> </html>
يمكن تكرار 100 ما المشكلةكود:<html> <head> <script language="JavaScript"> function ResizeTextArea(id,d) { var txtBox=document.getElementById(id); sVal= txtBox.value.length; if (sVal > d ) { txtBox.cols = (sVal+3);} } </script> </head> <body> <textarea onkeydown="ResizeTextArea(this.id,20);" id="txtTest1" name="txtTest1" cols="20" rows="1" style="overflow-y: hidden;" > </textarea><br> <textarea onkeydown="ResizeTextArea(this.id,20);" id="txtTest2" name="txtTest2" cols="20" rows="1" style="overflow-y: hidden;" > </textarea><br> <textarea onkeydown="ResizeTextArea(this.id,20);" id="txtTest3" name="txtTest3" cols="20" rows="1" style="overflow-y: hidden;" > </textarea><br> <textarea onkeydown="ResizeTextArea(this.id,20);" id="txtTest4" name="txtTest4" cols="20" rows="1" style="overflow-y: hidden;" > </textarea><br> <textarea onkeydown="ResizeTextArea(this.id,20);" id="txtTest5" name="txtTest5" cols="20" rows="1" style="overflow-y: hidden;" > </textarea><br> <textarea onkeydown="ResizeTextArea(this.id,20);" id="txtTest6" name="txtTest6" cols="20" rows="1" style="overflow-y: hidden;" > </textarea><br> <textarea onkeydown="ResizeTextArea(this.id,20);" id="txtTest7" name="txtTest7" cols="20" rows="1" style="overflow-y: hidden;" > </textarea><br> <textarea onkeydown="ResizeTextArea(this.id,20);" id="txtTest8" name="txtTest8" cols="20" rows="1" style="overflow-y: hidden;" > </textarea><br> <textarea onkeydown="ResizeTextArea(this.id,20);" id="txtTest9" name="txtTest9" cols="20" rows="1" style="overflow-y: hidden;" > </textarea><br> <textarea onkeydown="ResizeTextArea(this.id,20);" id="txtTest10" name="txtTest10" cols="20" rows="1" style="overflow-y: hidden;" > </textarea><br> </body> </html>
هل راعيت تغير الـ ID لكل عنصر
__________________
Professional Java?Script Programmer and Web Developer
عزيزي فاهم عليك ولكن انا بستخدمه في متغير في محرر نماذج كحقل واحد وأكرر أنقر على أيقونة المتغير في كل مره أستخدمه وفي أماكن مختلفه وبيأخذ الكود بآي دي واحد فما أدري هل يوجد حل ّ ؟؟؟
مش فاهم
ضع الكود الناتج هنا
__________________
Professional Java?Script Programmer and Web Developer
عزيزي شكراً لك تم حلّ المشكلة
مافيه حل يأ إخوان عند الطباعه ما تظهر حدود المربع ؟؟
انا أستخدم المربع النصي في محرر وأطبع نماذج ولكن عند الطباعه إذا أستخدمت المربع النصي بالكتابة بداخله تظهر حدود المربع وتعتيم خفيف خلفيه
هل فيه حلّ لتلافي هذه المشكلة ؟
قم بعمل ملف CSS خاص بالطابعه ، عن طريق media=print كما يلى :
كود PHP:
<link rel="stylesheet" type="text/css" media="print" href="print.css">
__________________
Keepondev | مدونه شديد التخصص فى الجافاسكربت
جافاسكربت الموجهه بالكائنات | أنماط تصميم جافاسكربت
وفقك الله أخي العزيز
سيتم التجربة إن شاء الله
عندي إضافة محتاج حجم الخط يكون 15 داخل المربع لأنة يظهر صغير جداً
آسف جداً على الإطالة عليكم
إخواني آسف على إزعاجكم أتمنى مساعدتي في تغيير حجم الخط داخل المربع لانه يطبع صغير