JQuery

[JQuery] summernote 사용법

chsr 2022. 3. 31. 13:25
728x90
반응형

■ JQuery summernote 사용법


 라이브러리

<!-- include libraries(jQuery, bootstrap) -->
<link href="https://stackpath.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css" rel="stylesheet">
<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js"></script>

<!-- include summernote css/js -->
<link href="https://cdn.jsdelivr.net/npm/summernote@0.8.18/dist/summernote.min.css" rel="stylesheet">
<script src="https://cdn.jsdelivr.net/npm/summernote@0.8.18/dist/summernote.min.js"></script>

 사용법

<textarea rows="5" placeholder="내용을 입력해주시기 바랍니다." id="w_content" name="w_content"></textarea>

<script type="text/javascript">
    $(document).ready(function() {
        $('#w_content').summernote({
            placeholder: "글 내용을 적어주세요.",
            height: 300,        
            minHeight: null,    
            maxHeight: null,   
            focus: true,
            callbacks: {
                onImageUpload: function(files, editor, welEditable) {
                    for (var i = files.length - 1; i >= 0; i--) {
                        sendFile(files[i], this);
                    }
                }
            }
        });
    });
</script>
728x90
반응형