Printable View
من می خوام یک ادیتور مثل عکس زیر رو بسازم
حالا اگر کسی از دوستان درباره این ادیتور چیزی می دونه بگه ممنون می شم
ادیتور های آماده ای که در این سایت قبلا معرفی شده خیلی خیلی سنگین هستن اگه امکانش هست یک ادیتور ساده مانند عکس بالا را در این قسمت قرار دهید اگر هم کسی چنین ادیتوری ندارد ولی اطلاعاتی در باره ساختش دارد رو اینجا قرار بده ممنونش می شم :10:
سوالی که نتونستم جوابش رو پیدا کنم :
چطوری می شه در یک textarea یک عکس رو نمایش داد ؟
جواب های زیادی وجود داره ولی هیچ راه حلی نبود !
سلام.
این دوتا کم حجم:
کد:http://www.dynamicdrive.com/dynamicindex16/richtexteditor/index.htm
http://www.dynamicdrive.com/dynamicindex16/openwysiwyg/readme.html
در اصل این ادیتورها از یک iframe برای خودشون استفاده می کنن، اصلا باید، برای ادیتورهای wysiwyg از فریم استفاده کرد، در غیر اینصورت که textarea که نمی تونه نیازهای شما رو برای ساخت یک ادیتور wysiwyg برآورده کنه!!!نقل قول:
سوالی که نتونستم جوابش رو پیدا کنم :
چطوری می شه در یک textarea یک عکس رو نمایش داد ؟
جواب های زیادی وجود داره ولی هیچ راه حلی نبود !
از بابت دوتالینکی که قرار دادی ممنون .نقل قول:
اما درباره اون دو خطی که نوشتی !
یعنی اگر بخوام یک ادیتور بسازم که مثلا امکانات زیر رو داشته باشه :
1 ) درج عکس
2 ) تغییر اندازه متن انتخاب شده
3 ) تغییر رنگ قلم متن انتخاب شده
4 ) زیر خط دار کردن متن انتخاب شده
5 ) تغییر جهت (یعنی letf to right و right to left و center ) متن انتخاب شده
باید از Iframe استفاده کنم ؟
من یک iframe در صفحه ایجاد کردم حالا چطوری مکان نما رو داخلش حرکت بدم ؟ چطوری مابین خط ها حرکت کنم ؟
وقتی که از لینک هایی بالا فایل ها رو گرفتم داخلش سه تا textarea بود که در داخلش پوشه اسکریپت داخل فایل wysiwyg از دوتا iframe استفاده شده
اگه درباره این یک مثال کوچولو بزنید ممنون می شم !کد:editor += '<iframe frameborder="0" id="wysiwyg' + n + '" class="iframeText" style="width:100%;height:' + currentHeight + ';"></iframe>\n'
+ '</td></tr>';
سلام
خیلی ممنون
تا باشه از این کارا :31:
سلام.نقل قول:
برای اونایی که شماره گداری کردی فقط از window.execCommand() استفاده می کنن!!!نقل قول:
1 ) درج عکس
2 ) تغییر اندازه متن انتخاب شده
3 ) تغییر رنگ قلم متن انتخاب شده
4 ) زیر خط دار کردن متن انتخاب شده
5 ) تغییر جهت (یعنی letf to right و right to left و center ) متن انتخاب شده
باید از Iframe استفاده کنم ؟
من یک iframe در صفحه ایجاد کردم حالا چطوری مکان نما رو داخلش حرکت بدم ؟ چطوری مابین خط ها حرکت کنم ؟
در رابطه با iframe هم برای اینکه بتونی مابین خطها و غیره حرکت کنی، یک پراپرتی ( property ) به iframe دلخواه اضافه کنی، تاخاصیت editable به خودش بگیره.
در کل فرآیند ساخت یک ادیتور یه خرده پیچیده است که زمان گیره و حوصله می خواد!!!
میشه یه مثال بزنید ( یا یه توضیحی بدید ! :41:) من این کد رو کجا باید بتویسیم چطوری فراخوانیش کنم ؟نقل قول:
یعنی یک باتن روی فرم قرار بدم بعد با استفاده از این دستور صفات متن انتخاب شده رو تغییر بدم؟ :40:
برای این هم یک توضیحی بدی ممنون می شم (شرمنده به مولا :11: )نقل قول:
چطوری اضافه کنم به کدام قسمتش ! :41:
حق با شماست ولی من یک ادیتور کامل نمی خوام درست کنم :13: می خوام همان گزینه هایی رو که عنوان کردم رو به صورت یک ادیتور داشته باشم :10:نقل قول:
سلام. منم یه همچین ادیتوری می خوام که فونت tahoma هم داشته باشه. از FCKeditor زیاد شنیدم و نصبش هم کردم اما یه عالمه آیکون داره که نمی دونم چطور می شه حذفشون کرد. اگه راهی هست ممنون میشم کمکم کنید.
من ادیتوری رو که جناب Amin eHelp در پست شماره 2 معرفی کردن :10: رو در یک صفحه به صورت آزمایشی قرار دادم که اگر خواستید ببینید می تونید به لینک زیر برید :11:
کد:http://www.khaterat.gigfa.com/a118/
خوب کار می کنه :27: ولی تو لود کردن عکس های بالایی کمی مشکل داره ! :18: ( زیاد مطمئن نیسم ولی فکر کنم اشکال داشته باشه یعنی تا زمانی که موس رو روشون نبری عکس لود نمی شه :11:)
[ منظور از عکس های بالایی همان قسمت انتخاب است که با انتخاب آنها می تونید متن رو رنگی و بولد و زیرخط دار کنید ]
متن به صورت پیش فرض از چپ به راست است :18: که من نتونستم این رو به صورت راست به چپ تبدیل کنم ! :41:
این ادیتور در مقایسه با ادیتور همین انجمن خیلی فرق داره برای همین هم می خوام که خودم به صورت خیلی خیلی محدود یک ادیتور بسازم ( البته به کمک شما دوستان :10: ) که زیاد حرفه ای هم نباشه :41:
من وقتی که در سایت جستجو کردم آموزشی درباره ساخت یک ادیتور نیافتم اگر مقاله ای چیزی هم در این باره دوستان دارند دراین قسمت قرار بدن ممنون می شم :10:
هر چند اگر دوستان آموزش ساخت یک ادیتور ساده را در این تایپیک شروع کنند که دعا گویشان خواهم بود :11:
سلام.
من همه اینها رو تئوری بلدم! و عملی هنوز اقدام نکردم!
این تکه کد توی یکی از فرومهای مجاور پیدا کردم شاید بدردت خورد!
قسمت contentWindow اون خصیصه رو به iframe تخصیص می ده، تا خاصیت editable بگیره...کد:TagX.document.execCommand(command,[ , bUserInterface ] [ , vValue ] ) ;
var tagName="editor"
var TagX;
if (document.all) {
TagX = frames[tagName];
} else {
TagX = document.getElementById(tagName).contentWindow;
}
---------
اگر من بصورت کامل یاد بگیرمش، حتما یه آموزش جامع می زارم!!!
دوستام ما هم خوشحال می شیم این بحث ادامه پیدا کنه و به نتیجه برسه
با تشکر از همه
خوب شما این تئوری رو که می گید از کجا می دونید منظورم منبعی مقاله ای سایتی چیزی اگه داری بده همه با هم استفاده کنم :10:نقل قول:
من یکی که نتونستم از این کد استفاده کنم اگه کسی تونست به ما هم بگه :10:نقل قول:
این کد رو به صورت یک تابع نوشتم و وقتی که فراخوانیش می کردم هیچ اتفاقی نمی افتاد:41:
هرچای صفحه که می شد قرار دادم نشد که نشد:41:
من در یک صفحه یه همچین Iframe رو ساختم (مابین head و مابین body و کلا هرچا که می شد از کد استفاده کردم نشد که نشد !)
کد:<body>
<script language="javascript" type="text/javascript">
TagX.document.execCommand(command,[ , bUserInterface ] [ , vValue ] ) ;
var tagName="editor"
var TagX;
if (document.all)
{
TagX = frames[tagName];
}
else
{
TagX = document.getElementById(tagName).contentWindow;
}
</script>
<iframe width="200" height="200" align="middle" id="editor" name="editor"></iframe>
</body>
داداش :10: حالا شما کی یاد می گیرید !نقل قول:
من گی می تونم این آموزش جامعی رو که می خواهید قرار بدید رو ببینم ؟ :11:
:40: چرا شما از این تایپیک شروع نمی کنید تا ما هم قدم به قدم با شما یاد بگیریم ؟ :40:
من يك وبلاگ ساختم در زمينه بازي هاي رايانه اي و خيلي هم فعاله ، و قصد دارم يك بخش اخبار روز بازي بهش اضافه كنم ولي مي خوام يه چيزي مثل بخش اخبار دارينوس كه عكسشو آخر همين مطلب مي ذارم درست كنم .(به خاطر چي مي خوام يه چيز مثل بخش اخبار دارينوس باشه؟1-روي هر عكس كوچك كه كليك مي كنم بدون لود دوباره صفحه عكس بزرگ رو نشون مي ده2-فايل فلش است و سرعت بالا آمدنش زياده 3-جلوه زيبايي داره )
لطفا هر كي هر چي ميدونه بگه چون واقعا لازم دارم.
سايت دارينوس >>>اينم عكس بخش اخبار دارينوس>>>کد:www.darinoos.net
[ برای مشاهده لینک ، با نام کاربری خود وارد شوید یا ثبت نام کنید ]
هیچ ربطی به این قسمت نداره !
سوال شما باعث به بیراهه گشیده شدن تایپیک می شه شما یه تاپیک جدید برای خودتان ایجاد کنید خواهشا !!!!
سلام.نقل قول:
این رو من قبلا هم گفتم، اگر مقاله ای چیزی بود که دیگه کسی سراغ ادیتورهای آماده نمی رفت!!!
من هر چی می دونم فقط با نگاه کردن به سورسهای این و اون بوده.
---------
در ضمن انتظار نداشته باش اون تکه کدی رو که بهت دادم واست کار کنه، مگه به این کشکیه؟!؟!؟
شما اگر بخواید فقط یک قسمت از نوشته رو به صورت bold در بیارید بازم باید خیلی بیشتر از اینها کد بنویسی، حالا این یکی که جای خود دارد(!)
این قسمت فقط برای راهنمایی بود که نشون بده چندتا آرگومان و چه نو مقدارهایی دریافت می کنه...کد:TagX.document.execCommand(command,[ , bUserInterface ] [ , vValue ] ) ;
--------
هر وقت که خدا بخواد!!!نقل قول:
داداش :10: حالا شما کی یاد می گیرید !
هروقت یاد گرفتم اونوقت می تونید ببینید، شایدم اصلا یاد نگرفتم:31:
گفتم چون بلد نیستم!نقل قول:
:40: چرا شما از این تایپیک شروع نمی کنید تا ما هم قدم به قدم با شما یاد بگیریم ؟ :40:
کسی دیگه ای نبود کمکی بکنه ؟
چرا من هنوز هستم!!! :دینقل قول:
این چندتا رو یه نگاهی بکن، مطمئنا کمکت می کنن.
همش کار من نیست، توی فرومهای مجاور پیدا دیده شده است!!!!کد:http://www.mozilla.org/editor/
http://www.devpapers.com/article/292
http://www.google.com/search?q=How+to+Execute+html+code+in+text+area
http://programmabilities.com/xml/?id=17
خیلی ممنون :46:نقل قول:
پس که اینطور ! :11:نقل قول:
اگه خودت بخواهی که هر وقت اراده کنی می تونی یاد بگیری در این شکی نیست [ برای مشاهده لینک ، با نام کاربری خود وارد شوید یا ثبت نام کنید ]نقل قول:
می دونم شما هستید منظورم دوستای دیگه بود که می خواستم اگه امکانش باشه اونهای دیگه هم یه کمکی کنند ! ( نه مثل دوست خوبم Neo-2008 جان که نمی دونه کجا باید سوالش رو مطرح کنه ها )نقل قول:
بابت لینک ها ممنوننقل قول:
ولی یه چند تا سوال :
تا این جا که من فهمیدم باید بیشتر با IFrame کار کنم ولی نمی دونم تو کدام تایپیک این انجمن دیدم که گفته بودن فریم ها دیگه منسوخ شدن !!! و باید با DIV کار کنید! آیا واقعا فریم ها منسوخ شدن ؟
یعنی چقدر ؟نقل قول:
اگه یه نمونه مثالی باشه که فقط یه چند تا کار رو انجام بده خیلی خوبه مثلا متن رو Bold کنه یک عکس رو در کنار متن وارد شده قرار بده بهتر می شه باهاش کار کرد !
برای این که من یک ادیتور بسازم به چه چیزهایی نیاز دارم ؟
یک ادیتور ساده :
به نظر من که خیلی ساده آمد من رفتم که روش کار کنم و به نتایجی برسم .کد:http://www.dynamicdrive.com/dynamicindex16/richtexteditor/rte.zip
هرچی پیدا کردم در این تایپیک قرار می دم .
سلام.نقل قول:
نه منسوخ نشده، ولی استفاده بی جای از اون توی صفحات وب اصلا پیشنهاد نمی شه.
بعدش شما خیلی زیادم با iframe کار نداری فقط یکی درست می کنی و اون کارهایی رو که باید انجام بدی رو انجام می دی.
توی لینک mozilla یه خرده بگرد، یه ادیتور ساده به عنوان نمونه گذاشته.
1 عدد جاوااسکریپت، بی نهایت تجربهنقل قول:
برای این که من یک ادیتور بسازم به چه چیزهایی نیاز دارم ؟
اون لینک دومی خیلی بدرد خورد امین جان
برای اولین بار الان وقت کردم یه نگاهی به سورس یکی از اینا بندازم, خیلی خیلی هم سخت نیست
از تابع execCommand فکر کنم راحت بشه استفاده کرد
مثلا" خودش اونو به صورت execCommand(20%'bold', false, 20%''); استفاده کرده بود, من به صورت execCommand(20%'fontsize', false, 20%'40'); تغییرش دادم و کار کرد (نتیجه ی دلخواه رو داد)
خودش به ساده ترین شکل ممکن درست کرده و توضیحات خوبی هم داده
یه چیز دیگه:
برای درج مقادیر قبلا" ثبت شده در ادیتور از یه فیلد مخفی استفاده کرده
در کل چندتا تابع خیلی غریبه استفاده کرده که من تاحالا ندیده بودم, فکر کنم بشه این رو به بهترین شکل ممکن برای خودمون توسعش بدیم (هرچند هنوز اطلاعاتمون در حدی نیست که بتونیم از 0 بنویسیم)
خوشحال می شم بحث ادامه پیدا کنه, ممنون از دوستان
سلام.نقل قول:
به این می گن اراده!!!
منم چون تا حالا نرفته بودم سراغش فکر می کردم، چیزه زیاد شاخیه!
نقل قول:
سلام
بخث بسیار خوبیه من هم خیلی دلم می خواد برای خودم یک ادیتور بسازم اما یاد ندارم که ان شا... با همین تاپیک یاد می گیرم :31:
اگر لطف کنی و سورس این ادیتور رو بذاری ممنون میشم
با تشکر
انشااللهنقل قول:
بخث بسیار خوبیه من هم خیلی دلم می خواد برای خودم یک ادیتور بسازم اما یاد ندارم که ان شا... با همین تاپیک یاد می گیرم
در پست شماره 2 آقا امین زحمت گشیدن شما بهتر بود که صفحه اول رو هم یه نگاه می کردید !نقل قول:
اگر لطف کنی و سورس این ادیتور رو بذاری ممنون میشم
کد:http://www.dynamicdrive.com/dynamicindex16/richtexteditor/index.htm
کد:http://www.dynamicdrive.com/dynamicindex16/openwysiwyg/readme.html
کد:http://www.mozilla.org/editor/
کد:http://www.devpapers.com/article/292
کد:http://www.google.com/search?q=How+to+Execute+html+code+in+text+area
این یکی هم کم حجم و خیلی واضح است که به نظر من برای شروع خوبه !کد:http://programmabilities.com/xml/?id=17
برای دعوت نامه هم یه تایپیک دیکه ای وجود داره که می تونید از آن استفاده کنیدکد:http://www.dynamicdrive.com/dynamicindex16/richtexteditor/rte.zip
من از صفحه ی اول خوندم این تاپیک رو ولی من فقط سورسش رو می خواستم توی این سایت ها رفتم سورس کاملش رو پیدا نکردم که در خواست دادم :11:نقل قول:
ماشالله شما چه چشم های تیزی دارید !!!نقل قول:
[ برای مشاهده لینک ، با نام کاربری خود وارد شوید یا ثبت نام کنید ]کد:http://www.dynamicdrive.com/dynamicindex16/richtexteditor/index.htm
در ضمن برای دعوتنامه هم به لینک زیر برو
کد:http://forum.p30world.com/showthread.php?t=98086&highlight=%D8%AF%D8%B9%D9%88%D8%AA%D9%86%D8%A7%D9%85%D9%87+%D9%BE%D8%A7%D8%B1%D8%B3&page=89
سلام
کسی در مورد paste کردن اطلاعاتی داره؟ شما می تونید یه جدول رو توی این ادیتور paste کنید!!!! اگه نخوایم جدول یا div ها paste بشه چی؟! اگه بخوایم بعد از paste پاک بشه چی؟
در ضمن مثلا" button ها هم paste میشن!!!
شرمنده فکر نکرده پست زدم
میشه این مشکل رو با استفاده از توابع perl سازگار با php حل کرد, من الآن یه نمونه ی خیلی سادش رو نوشتم
[php]
<?PHP
$text = '<div id="test"><font color="#000">TEST</font></div><input type="text">asd';
$search = array('table', 'div', 'input'); // تگ هایی که می خوایم حذف بشن
foreach ($search as $each)
{
$text = preg_replace("/<" . $each . ".*?>/i", NULL, $text); //تگ آغازی
$text = preg_replace("/<\/" . $each . ">/i", NULL, $text); //تگ پایانی (در صورت وجود)
}
echo htmlspecialchars ( $text );
?>[/php]برای جاوا اسکریپت هم میشه یه همچین چیزی نوشت
اینم کد جاوا اسکریپتش:
کد:<script language="javascript">
var text = '<div id="test"><font color="#000">TEST</font></div><input type="text">asd';
var search = Array('table', 'div', 'input');
for (i=0; i<search.length; i++)
{
text = eval( "text.replace(/<" + search[i] + ".*?>/ig, '')" );
text = eval( "text.replace(/<\\/" + search[i] + ">/ig, '')" );
}
alert(text);
</script>
ممکنه در مورد وارد کردن اطلاعات به یه iframe بیشتر توضیح بدین!!!
واقعان به دردم خوردنقل قول:
ممنون
تاپيك براي چند سال پيش هست. لطفا پست هاتون رو در تاپيك هاي جديد ارسال كنيد
در ظمن پست هاي تبليغاتي حذف شدند
بسته شد/