Trình chỉnh sửa đánh dấu xem trước trực tiếp

Question

Hãy tha thứ cho tôi nếu điều này đã được trả lời. Tôi đã nhìn xung quanh, nhưng không tìm thấy gì cả.

Tôi đang tạo trang web cho những người không phải là công nghệ và yêu cầu họ có thể thêm nội dung văn bản đa dạng thức. Tôi đã xem xét Markdown cho điều này, và muốn sử dụng nó.

Tôi đã tìm kiếm một điều khiển ui đẹp (jquery) để chỉnh sửa đơn giản, nhưng mọi thứ tôi đã xem đều có bản xem trước trực tiếp ở một nơi khác trên trang khác với hộp nhập. (WMD là như thế này, markitup, vv ..)

Tôi muốn sử dụng một cái gì đó mà làm cho nó cảm thấy như bạn đang sử dụng một bộ xử lý văn bản. Giống như cách TinyMCe thực hiện điều đó, nhưng chạy trên Markdown, không phải HTML

Có điều gì giống như vậy hoặc có thể một nơi nào đó thể hiện cách xây dựng nó?

---

Để làm rõ, tôi đang tìm một trình chỉnh sửa giúp bạn cảm thấy như đang nhập bản xem trước trực tiếp; không phải là hộp văn bản có bản xem trước ở trên/dưới đây.

Answer 1

Tôi đã tìm được thứ mà tôi yêu thích. Pen editor on Github chỉ là những gì tôi muốn. Tôi vui mừng khi thấy ai đó đã thực hiện điều này trên

Answer 2

Đánh dấu sẽ không tương thích với trình chỉnh sửa WYSIWYG. Hãy xem xét mẫu này Đánh dấu:

Let's link to [Google][]. 

    [Google]: http://www.google.com/ 

Nếu bạn đang tạo trình soạn thảo WYSIWYG, điều gì sẽ xảy ra sau khi bạn nhập [Google]? Bạn có thấy văn bản được gạch dưới màu xanh không? Bạn sẽ chỉ thấy [Google] vì nó không phải là một siêu liên kết hợp lệ chưa? Điều gì sau khi bạn nhập dấu vết []? Nó vẫn không phải là một siêu liên kết được xác định đầy đủ; bạn không thể nhấp vào nó, bởi vì Markdown không biết nó liên kết ở đâu.

Và cách người dùng nhập [Google]: http://www.google.com/ dòng dõi tiếp theo? Dòng đó không được hiển thị; đó là đánh dấu; nó vô hình. Bạn nhập văn bản vô hình vào trình soạn thảo WYSIWYG ở đâu?

Answer 3

Nếu tôi có được những gì bạn đang tìm kiếm, sau đó cách tiếp cận đơn giản nhất sẽ được tạo ra HTML với TinyMCE hoặc CKEditor, sau đó áp dụng một cái gì đó giống như Markdownify đến đầu ra của ví dụ tinymce.getContent().

Answer 4

Kiểm tra Stack Edit Đó là trình chỉnh sửa đánh dấu WYSIWYG tuyệt vời - đồng bộ hóa với Google Documents, Dropbox & CouchDB, xuất bản lên Github (và nhiều địa điểm khác) và cung cấp chia sẻ liên kết dễ dàng. Bạn có thể truy cập nó trên trang web của họ hoặc sử dụng ứng dụng Chrome. Bạn có thể tạo tiêu đề và danh sách trong trình chỉnh sửa ở đó và nó sẽ hiển thị cho bạn văn bản tương ứng ở định dạng đánh dấu. Sau đó, bạn có thể lưu, xuất bản, chia sẻ hoặc tải xuống tệp.