Google Wave comme WYSIWYG

Je cherchais l'éditeur wysiwyg google wave-like, mais je n'y suis pas parvenu. J'ai essayé jWYSIWYG, clEditor et deux autres éditeurs.Google Wave comme WYSIWYG

Maintenant je veux l'implémenter par moi-même. Avez-vous des idées sur la façon dont cela fonctionne? Surtout comment dessinent-ils un caret et manipulent des événements de souris/clavier et sélection de texte.

Je ne veux utiliser aucun éditeur WYSIWYG existant car ils ne me donnent pas ce que je veux.

Merci d'avance.

Source

2011-08-02 Nikolay Sohryakov

Si vous ne savez pas par où commencer, cela va être une tâche très difficile. Vous devriez vraiment essayer de trouver un éditeur que vous pouvez modifier –

Je vais répondre à ma question - utiliser la propriété contentEditable.

Source

2011-08-04 08:08:43

Vous pouvez jeter un coup d'œil sur le code source de certains des éditeurs open source les plus populaires pour avoir une idée de leur approche, vous donner un aperçu de la façon dont vous voulez résoudre votre problème.

TinyMCE est sur GitHub:

https://github.com/tinymce/tinymce

CKEditor a un repo SVN:

http://dev.ckeditor.com/browser

Et bien sûr, ils sont le Javascript, donc vous regardez vraiment l'un d'eux vous vouloir.

Source

2011-08-02 20:45:18 Evan

Ils utilisent tous iFrame et remplacent avec. C'est la première raison pour laquelle je ne veux pas utiliser ce genre d'éditeurs. – <span class="text-secondary"> <small> <span></span> </small> </span> </p> </div> </div> </div> </div> </div> </article> </div> <div class="clearfix"> </div> <div class="relative-box"> <div class="relative">Questions connexes</div> <ul class="relative_list"> <li> 1. <a href="http://fr.voidcc.com/question/p-hezkyhwe-b.html" target="_blank" title="google wave OnBlipSubmitted"> google wave OnBlipSubmitted </a> </li> <li> 2. <a href="http://fr.voidcc.com/question/p-dbkeiyce-e.html" target="_blank" title="Google Wave Sandbox"> Google Wave Sandbox </a> </li> <li> 3. <a href="http://fr.voidcc.com/question/p-wwiulpjb-bt.html" target="_blank" title="API Google Wave + ASP.NET"> API Google Wave + ASP.NET </a> </li> <li> 4. <a href="http://fr.voidcc.com/question/p-cjpunvuv-gb.html" target="_blank" title="qu'est-ce que google wave?"> qu'est-ce que google wave? </a> </li> <li> 5. <a href="http://fr.voidcc.com/question/p-ptrhazlq-bw.html" target="_blank" title="Installation du serveur Google Wave"> Installation du serveur Google Wave </a> </li> <li> 6. <a href="http://fr.voidcc.com/question/p-hbimyznp-cq.html" target="_blank" title="Google Closure Editor/WYSIWYG"> Google Closure Editor/WYSIWYG </a> </li> <li> 7. <a href="http://fr.voidcc.com/question/p-fukfjrcw-dz.html" target="_blank" title="Google Chrome échappe WYSIWYG Javascript"> Google Chrome échappe WYSIWYG Javascript </a> </li> <li> 8. <a href="http://fr.voidcc.com/question/p-oqefuovo-bv.html" target="_blank" title="Comment construire un client à Google Wave"> Comment construire un client à Google Wave </a> </li> <li> 9. <a href="http://fr.voidcc.com/question/p-ywkevisj-bb.html" target="_blank" title="Comment intégrer Google Wave à l'aide de Google Web Toolkit?"> Comment intégrer Google Wave à l'aide de Google Web Toolkit? </a> </li> <li> 10. <a href="http://fr.voidcc.com/question/p-gueizkvc-cg.html" target="_blank" title="Gadget Google Wave: gadgets.window est indéfini"> Gadget Google Wave: gadgets.window est indéfini </a> </li> <li> 11. <a href="http://fr.voidcc.com/question/p-bejgkabi-bw.html" target="_blank" title="Créer votre propre fédération google wave"> Créer votre propre fédération google wave </a> </li> <li> 12. <a href="http://fr.voidcc.com/question/p-tgwqxonc-bk.html" target="_blank" title="Exception d'argument illégal dans Google Wave App"> Exception d'argument illégal dans Google Wave App </a> </li> <li> 13. <a href="http://fr.voidcc.com/question/p-fumydrcn-bz.html" target="_blank" title="Google Wave - Ajout d'un participant à un Wave avec l'API Python"> Google Wave - Ajout d'un participant à un Wave avec l'API Python </a> </li> <li> 14. <a href="http://fr.voidcc.com/question/p-bajnbyuc-ea.html" target="_blank" title="Apache Wave API"> Apache Wave API </a> </li> <li> 15. <a href="http://fr.voidcc.com/question/p-cdkqxxxp-k.html" target="_blank" title="Comment créer des barres de défilement de type Google Wave?"> Comment créer des barres de défilement de type Google Wave? </a> </li> <li> 16. <a href="http://fr.voidcc.com/question/p-ccwefnmf-ck.html" target="_blank" title="Pourquoi Google Wave Operational Transform a-t-il besoin d'annotations?"> Pourquoi Google Wave Operational Transform a-t-il besoin d'annotations? </a> </li> <li> 17. <a href="http://fr.voidcc.com/question/p-cdoiepqb-bb.html" target="_blank" title="faire des choses simples avec un robot Google Wave"> faire des choses simples avec un robot Google Wave </a> </li> <li> 18. <a href="http://fr.voidcc.com/question/p-aciwgfrr-cg.html" target="_blank" title="Silverlight onLoad événement non déclenché à l'intérieur de Google Wave"> Silverlight onLoad événement non déclenché à l'intérieur de Google Wave </a> </li> <li> 19. <a href="http://fr.voidcc.com/question/p-ngppvstz-ck.html" target="_blank" title="Comment un Robot répond-il en privé dans Google Wave?"> Comment un Robot répond-il en privé dans Google Wave? </a> </li> <li> 20. <a href="http://fr.voidcc.com/question/p-gisvyeaf-e.html" target="_blank" title="Comment intégrer la balise SVG dans le gadget google wave?"> Comment intégrer la balise SVG dans le gadget google wave? </a> </li> <li> 21. <a href="http://fr.voidcc.com/question/p-bfbnjjgo-bq.html" target="_blank" title="Tutoriel Google Wave Python - Rien ne se passe"> Tutoriel Google Wave Python - Rien ne se passe </a> </li> <li> 22. <a href="http://fr.voidcc.com/question/p-znfytbqa-bd.html" target="_blank" title="Google Wave en tant que référentiel de code et IDE?"> Google Wave en tant que référentiel de code et IDE? </a> </li> <li> 23. <a href="http://fr.voidcc.com/question/p-bzzkeopk-ck.html" target="_blank" title="Liste complète des clients de l'éditeur de texte Google Wave?"> Liste complète des clients de l'éditeur de texte Google Wave? </a> </li> <li> 24. <a href="http://fr.voidcc.com/question/p-ttftfbtr-cg.html" target="_blank" title="httpError 502 avec Google Wave API active Robot fetch_wavelet()"> httpError 502 avec Google Wave API active Robot fetch_wavelet() </a> </li> <li> 25. <a href="http://fr.voidcc.com/question/p-fqmhrxrf-bv.html" target="_blank" title="Quelle solution côté serveur Google Wave a-t-il utilisée?"> Quelle solution côté serveur Google Wave a-t-il utilisée? </a> </li> <li> 26. <a href="http://fr.voidcc.com/question/p-tfiufxlo-h.html" target="_blank" title="Vérificateur d'orthographe compatible avec le contexte Google Wave"> Vérificateur d'orthographe compatible avec le contexte Google Wave </a> </li> <li> 27. <a href="http://fr.voidcc.com/question/p-puyqbbwe-p.html" target="_blank" title="Comment puis-je écrire un client enrichi Google Wave?"> Comment puis-je écrire un client enrichi Google Wave? </a> </li> <li> 28. <a href="http://fr.voidcc.com/question/p-czxjeodb-be.html" target="_blank" title="Extension Google Wave pour les programmeurs et leur code"> Extension Google Wave pour les programmeurs et leur code </a> </li> <li> 29. <a href="http://fr.voidcc.com/question/p-gbsgtvzy-cm.html" target="_blank" title="Unité testant les robots wave de Google en Java"> Unité testant les robots wave de Google en Java </a> </li> <li> 30. <a href="http://fr.voidcc.com/question/p-frxmjfis-ks.html" target="_blank" title="Wave Header corrompu"> Wave Header corrompu </a> </li> </ul> </div> <div> <script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script> <ins class="adsbygoogle" style="display:block" data-ad-format="autorelaxed" data-ad-client="ca-pub-6208739752673518" data-ad-slot="3534119089"></ins> <script> (adsbygoogle = window.adsbygoogle || []).push({}); </script> </div> <div class="padding-top-10"></div> </div> </div> <script type="text/javascript" src="http://img2.voidcc.com/voidso/script/side.js?t=1652515422260"></script> <script type="text/javascript" src="http://img2.voidcc.com/voidso/plugin/highlight/highlight.pack.js"></script> <link href="http://img2.voidcc.com/voidso/plugin/highlight/styles/docco.css" media="screen" rel="stylesheet" type="text/css" /> <script type="text/javascript"> $('pre').each(function(i, e) { hljs.highlightBlock(e, "<span class='indent'> </span>", false) }); </script> <div class="col-lg-3 col-md-4 col-sm-5"> <div id="rightTop"> <div class="row"> <script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>  <ins class="adsbygoogle" style="display:block" data-ad-client="ca-pub-6208739752673518" data-ad-slot="3862022848" data-ad-format="auto" data-full-width-responsive="true"></ins> <script> (adsbygoogle = window.adsbygoogle || []).push({}); </script> </div> <div class="row sidebar panel panel-default"> <div class="panel-heading font-bold"> Dernière question </div> <div class="m-b-sm m-t-sm clearfix"> <ul class="side_article_list"> <li class="side_article_list_item"> 1. <a href="http://fr.voidcc.com/question/p-cfpmuaot-bkv.html" target="_blank" title="SN. FlatProperties Table Design"> SN. FlatProperties Table Design </a> </li> <li class="side_article_list_item"> 2. <a href="http://fr.voidcc.com/question/p-utacvflg-bkv.html" target="_blank" title="Impossible d'accéder à View of Fragment avec ViewPager et FragmentPagerAdapter"> Impossible d'accéder à View of Fragment avec ViewPager et FragmentPagerAdapter </a> </li> <li class="side_article_list_item"> 3. <a href="http://fr.voidcc.com/question/p-vauvxjdx-bkv.html" target="_blank" title="Mon code ne fonctionnera pas dans Chrome mais fonctionne bien dans JSFiddle"> Mon code ne fonctionnera pas dans Chrome mais fonctionne bien dans JSFiddle </a> </li> <li class="side_article_list_item"> 4. <a href="http://fr.voidcc.com/question/p-zfhgmqzi-bkv.html" target="_blank" title="Comment Ajoutant à balise p jQuery"> Comment Ajoutant à balise p jQuery </a> </li> <li class="side_article_list_item"> 5. <a href="http://fr.voidcc.com/question/p-djlogkum-bkv.html" target="_blank" title="Trouver l'arborescence des composants dans Android Studio 2.3.3"> Trouver l'arborescence des composants dans Android Studio 2.3.3 </a> </li> <li class="side_article_list_item"> 6. <a href="http://fr.voidcc.com/question/p-dlesyzuu-bkx.html" target="_blank" title="Django incapable de changer fuseau horaire du format UTC"> Django incapable de changer fuseau horaire du format UTC </a> </li> <li class="side_article_list_item"> 7. <a href="http://fr.voidcc.com/question/p-nlpmjpbw-bkw.html" target="_blank" title="Utilisation de 1 seule colonne pour représenter l'histogramme dans R"> Utilisation de 1 seule colonne pour représenter l'histogramme dans R </a> </li> <li class="side_article_list_item"> 8. <a href="http://fr.voidcc.com/question/p-fjcdqmar-bkw.html" target="_blank" title="Obtention d'erreur: types incomparables: char et String"> Obtention d'erreur: types incomparables: char et String </a> </li> <li class="side_article_list_item"> 9. <a href="http://fr.voidcc.com/question/p-efytctiv-bkw.html" target="_blank" title="Clavier Android pousser tout le contenu"> Clavier Android pousser tout le contenu </a> </li> <li class="side_article_list_item"> 10. <a href="http://fr.voidcc.com/question/p-bmowxekn-bkw.html" target="_blank" title="aurelia: liaison et @observable ne fonctionnant pas"> aurelia: liaison et @observable ne fonctionnant pas </a> </li> </ul> </div> </div> </div> <p class="article-nav-bar"></p> <div class="row sidebar article-nav"> <div class="row box_white visible-sm visible-md visible-lg margin-zero"> <div class="top"> <h3 class="title"><i class="glyphicon glyphicon-th-list"></i> Questions connexes</h3> </div> <div class="article-relative-content"> <ul class="side_article_list"> <li class="side_article_list_item"> 1. <a href="http://fr.voidcc.com/question/p-hezkyhwe-b.html" target="_blank" title="google wave OnBlipSubmitted"> google wave OnBlipSubmitted </a> </li> <li class="side_article_list_item"> 2. <a href="http://fr.voidcc.com/question/p-dbkeiyce-e.html" target="_blank" title="Google Wave Sandbox"> Google Wave Sandbox </a> </li> <li class="side_article_list_item"> 3. <a href="http://fr.voidcc.com/question/p-wwiulpjb-bt.html" target="_blank" title="API Google Wave + ASP.NET"> API Google Wave + ASP.NET </a> </li> <li class="side_article_list_item"> 4. <a href="http://fr.voidcc.com/question/p-cjpunvuv-gb.html" target="_blank" title="qu'est-ce que google wave?"> qu'est-ce que google wave? </a> </li> <li class="side_article_list_item"> 5. <a href="http://fr.voidcc.com/question/p-ptrhazlq-bw.html" target="_blank" title="Installation du serveur Google Wave"> Installation du serveur Google Wave </a> </li> <li class="side_article_list_item"> 6. <a href="http://fr.voidcc.com/question/p-hbimyznp-cq.html" target="_blank" title="Google Closure Editor/WYSIWYG"> Google Closure Editor/WYSIWYG </a> </li> <li class="side_article_list_item"> 7. <a href="http://fr.voidcc.com/question/p-fukfjrcw-dz.html" target="_blank" title="Google Chrome échappe WYSIWYG Javascript"> Google Chrome échappe WYSIWYG Javascript </a> </li> <li class="side_article_list_item"> 8. <a href="http://fr.voidcc.com/question/p-oqefuovo-bv.html" target="_blank" title="Comment construire un client à Google Wave"> Comment construire un client à Google Wave </a> </li> <li class="side_article_list_item"> 9. <a href="http://fr.voidcc.com/question/p-ywkevisj-bb.html" target="_blank" title="Comment intégrer Google Wave à l'aide de Google Web Toolkit?"> Comment intégrer Google Wave à l'aide de Google Web Toolkit? </a> </li> <li class="side_article_list_item"> 10. <a href="http://fr.voidcc.com/question/p-gueizkvc-cg.html" target="_blank" title="Gadget Google Wave: gadgets.window est indéfini"> Gadget Google Wave: gadgets.window est indéfini </a> </li> </ul> </div> </div> </div> </div> </div> </div> </div>  <footer id="footer"> <div class="bg-simple lt"> <div class="container"> <div class="row padder-v m-t"> <div class="col-xs-8"> <ul class="list-inline"> <li><a href="http://fr.voidcc.com/contact">Nous contacter</a></li> <li>© 2020 FR.VOIDCC.COM</li> <li><a rel="nofollow" href="https://beian.miit.gov.cn/" target="_blank">沪ICP备13005482号-13</a></li> <li><script type="text/javascript" src="https://s9.cnzz.com/z_stat.php?id=1280098168&web_id=1280098168"></script></li> <li><a href="http://cn.voidcc.com/" target="_blank" title="程序问答园区">简体中文</a></li> <li><a href="http://hk.voidcc.com/" target="_blank" title="程序問答園區">繁體中文</a></li> <li><a href="http://ru.voidcc.com/" target="_blank" title="поле вопросов и ответов">Русский</a></li> <li><a href="http://de.voidcc.com/" target="_blank" title="Frage - und - antwort - Park">Deutsch</a></li> <li><a href="http://es.voidcc.com/" target="_blank" title="Preguntas y respuestas">Español</a></li> <li><a href="http://hi.voidcc.com/" target="_blank" title="कार्यक्रम प्रश्न और उत्तर पार्क">हिन्दी</a></li> <li><a href="http://it.voidcc.com/" target="_blank" title="IL Programma di chiedere Park">Italiano</a></li> <li><a href="http://ja.voidcc.com/" target="_blank" title="プログラム問答園区">日本語</a></li> <li><a href="http://ko.voidcc.com/" target="_blank" title="프로그램 문답 단지">한국어</a></li> <li><a href="http://pl.voidcc.com/" target="_blank" title="program o park">Polski</a></li> <li><a href="http://tr.voidcc.com/" target="_blank" title="Program soru ve cevap parkı">Türkçe</a></li> <li><a href="http://vi.voidcc.com/" target="_blank" title="Đáp ứng viên">Tiếng Việt</a></li> <li><a href="http://fr.voidcc.com/" target="_blank" title="Programme interrogation Park">Française</a></li> </ul> </div> </div> </div> </div> </div> </footer>  <script async src="https://www.googletagmanager.com/gtag/js?id=UA-77509369-5"></script> <script> window.dataLayer = window.dataLayer || []; function gtag() { dataLayer.push(arguments); } gtag('js', new Date()); gtag('config', 'UA-77509369-5'); </script> <script> var _hmt = _hmt || []; (function () { var hm = document.createElement("script"); hm.src = "https://hm.baidu.com/hm.js?67d4731349f0b00136755b80364ce381"; var s = document.getElementsByTagName("script")[0]; s.parentNode.insertBefore(hm, s); })(); </script> </body> </html>

Google Wave comme WYSIWYG

Répondre