Apakah ada perpustakaan atau kontrol Javascript penurunan harga yang baik? [Tutup]

89

Saya ingin membangun situs di mana pengguna dapat memasukkan teks dan memformatnya dalam penurunan harga. Alasan saya menginginkan solusi Javascript adalah karena saya ingin menampilkan pratinjau langsung, seperti di StackOverflow.

Situs saya tidak ditargetkan untuk pengembang, jadi kontrol editor akan ideal.

Saya menyimpulkan bahwa di StackOverflow, editor WMD sedang digunakan.

Pencarian cepat di Google juga memunculkan perpustakaan Showdown, yang menurut saya sebenarnya digunakan oleh WMD.

Apakah ada pilihan lain? Apakah WMD / Showdown sudah menjadi alat yang hebat? Apa pengalaman Anda dengan opsi yang berbeda?

javascript controls markdown webmat
sumber

Jawaban:

33

Jika Anda tidak menolak menggunakan Ajax untuk membuat pratinjau langsung, maka opsi lainnya adalah markItUp! . markItUp! adalah editor markup universal, dan sangat fleksibel. Itu memang menyediakan cara mudah untuk membuat editor markup, tetapi tidak seperti WMD, itu tidak menyediakan pratinjau langsungnya sendiri.

Saya menggunakan markItUp !, bersama dengan JSP sederhana (menggunakan MarkdownJ ) untuk salah satu proyek open-source saya ( plugin Markdown untuk Roller ). Jika Anda menggunakan teknologi sisi server lain, ganti JSP sederhana itu sebagaimana mestinya.

Saya benar-benar mulai menggunakan ini sebelum saya menemukan WMD. Saya setuju, WMD memang bagus, tetapi baru saja bersumber terbuka dan, pada tahap ini, lebih sulit untuk menyesuaikan perilakunya.

myabc
sumber
MarkItUp! tidak menangani pilihan beralih dan lengket. Ini adalah editor teks penurunan harga open-source saya berdasarkan JavaScript. Ini mendukung pintasan keyboard, dialog khusus, tetes khusus, dan juga mendukung beberapa pemilihan teks pintar yang rapi untuk mendorong pengguna menulis sintaks Markdown dalam format yang baik: github.com/tovic/markdown-text-editor
Taufik Nurrohman
65

Kami cukup senang dengan WMD. Namun, ada beberapa bug yang mengganggu di dalamnya. Tidak ada yang besar, tetapi saya akan senang jika John Fraser (penulis) membuat kode open source sehingga kita dapat memperbaiki beberapa di antaranya. Dia berjanji untuk melakukannya tetapi proyek kehidupan nyata lainnya menghalangi.

Saya melakukan tindak lanjut dengan John setiap minggu. Saya akan memposting di blog setelah sumber WMD akhirnya tersedia. Belum bisa menghubungi John Fraser selama lebih dari setahun sekarang.

Kami memiliki sumber terbuka di pustaka JavaScript Markdown

http://code.google.com/p/pagedown/

dan pustaka penurunan harga C # sisi server

http://code.google.com/p/markdownsharp/

Jeff Atwood
sumber
Terima kasih atas jawabannya Jeff. Saya bahkan tidak menyadari WMD bukanlah open source ... Saya akan tetap membuka mata saya.
webmat
2
Apa yang Anda lakukan tentang celah keamanan yang menganga? Misalnya: <div onmouseover = "alert ('hi');"> hi </div> Hal di atas berfungsi dalam demo WMD!
andrewrk
1
@ superjoe30 Hal tersebut disaring di server.
epochwolf
@ superjoe30: Lihat meta.stackexchange.com/questions/95821/… - hal yang sama berlaku untuk versi JavaScript
balpha
1
@DisgruntledGoat melihat stackexchange.github.io Anda dapat melihat bahwa itu dalam daftar dan komit terakhir adalah 6 bulan yang lalu (2015 sudah).
Loïc Faure-Lacroix
12

Saya akan merekomendasikan tanda , yang ringan, efisien, mudah digunakan dan mendukung GitHub Flavored Markdown (GFM) juga. Ini dapat digunakan di sisi server (nodejs) atau klien (browser).

malcomwu.dll
sumber
ditandai masih dikembangkan dan versi mininya hanya berukuran 23 KB.
Peter T.
7

Sejauh yang saya tahu sebenarnya tidak ada editor berbasis browser lain untuk penurunan harga, setidaknya tidak ada yang seluas editor WMD.

Showdown adalah konverter penurunan harga di JS, yang membentuk dasar untuk pratinjau HTML dari WMD. Keduanya dibuat oleh http://attacklab.net/ .

Dan sejauh yang saya tahu belum ada keluhan besar tentang keduanya (setidaknya tidak di milis Penurunan Harga). Jadi lakukanlah.

Lasar
sumber
4

Strapdown.js, yang baru - baru ini dirilis , "membuatnya sangat sederhana untuk membuat dokumen penurunan harga yang elegan. Tidak diperlukan kompilasi sisi server."

g33kz0r
sumber
3

Pertanyaannya bahkan lebih kuno sekarang tetapi juga lebih relevan karena banyak kode yang disebutkan beberapa tahun kedaluwarsa.

Namun, saya menemukan beberapa yang masih tampak terkini:

Jquery-Markedit - Ini telah bercabang dari wmd-edit beberapa waktu yang lalu dan direfraktorisasi untuk menggunakan jQuery. Sepertinya bagus pada pandangan pertama.

EpicEditor - juga masih dipertahankan, memiliki parser yang fleksibel dan, seperti yang Anda lihat di bawah, pembuatnya sangat responsif (lihat di bawah). IT sepertinya memiliki dokumentasi yang bagus juga. Sayangnya tidak bekerja dengan IE9.

MarkdownDeep adalah opsi ketiga yang masih berjalan. Hal yang menarik dengan yang satu ini adalah dukungan untuk penurunan harga ekstra. Memiliki ketergantungan pada JQuery (sebenarnya Anda juga dapat mengimplementasikan tanpa JQuery). Berdasarkan versi .NET jadi dokumentasinya lebih selaras dengan itu daripada versi JS. Ini juga bekerja dengan IE9. Ini sangat mudah digunakan (dengan JQuery) & sangat sederhana. Tidak ada perkembangan signifikan yang terjadi dengan ini sejauh yang saya bisa lihat.

js-markdown-extra adalah port yang cukup akurat dari pustaka PHP dan masih dalam pemeliharaan. Ini mendukung penurunan harga ekstra tentu saja.

Julian Knight
sumber
1
Pratinjau langsung berfungsi dengan baik dengan editor saya :) buka layar penuh sebagai contoh atau jalankan saat tombol preview()turun atau batas waktu. Itu dibangun untuk segala jenis penyesuaian.
Oscar Godson
1
Jadi, di bawah editor adalah cara kerjanya sekarang. Setelah Anda mengklik pratinjau, itu menunjukkan pratinjau tersembunyi yang diperbarui dengan apa yang Anda tulis. Layar penuh melakukannya (agak) saat Anda mengetik. Untuk membuat pratinjau sendiri, Anda dapat melakukan sesuatu seperti ini: jsbin.com/otuyub/edit#javascript,html
Oscar Godson
1
Mencegat? Anda dapat melakukan: editor.on('save', function(file) { console.log(file.content) })jika itu yang Anda maksud. Itu akan memuntahkan konten file setiap kali file disimpan.
Oscar Godson
1
Selain itu, Anda mungkin ingin menggunakan on('update')alih-alih menyimpan. Simpan akan banyak disulut jika Anda mengaktifkan penyimpanan otomatis. Pembaruan hanya akan aktif ketika ada perubahan. epiceditor.com/#events
Oscar Godson
1
FYI kepada siapa pun yang membaca ini: github.com/OscarGodson/EpicEditor/issues/137 - masalahnya adalah ia mencoba dijalankan secara lokal dan IE9 memiliki batasan keamanan terhadap penggunaan localStorage secara lokal melalui file: \\\
Oscar Godson
2

Pertanyaannya kuno tapi semoga ini bisa membantu seseorang. Saya baru saja menerbitkan versi kerja editor penurunan harga Javascript saya sendiri, uedit . Anda dapat menemukan kode sumbernya di sini . Ia bekerja pada sebagian besar browser (termasuk IE6 +) dan tidak bergantung pada pustaka JS eksternal.

schmrz
sumber
2

Setelah mencoba dengan beberapa plugin untuk menyelesaikan kebutuhan saya sendiri dalam menawarkan MarkDown seudo-WYSIWYG, saya akhirnya menerapkan yang saya sendiri:

Mungkin tidak sekuat semua solusi yang dikomentari di sini tetapi saya pikir tidak ada yang sesederhana dan mudah untuk diintegrasikan dan disesuaikan .

fguillen.dll
sumber