CKEditor’de Editör Enable ve Disable Nasıl Yapılır?
![CKEditor'de Editör Enable ve Disable Nasıl Yapılır?](https://yazilimkodu.com/wp-content/uploads/2021/11/ckeditorde-editor-enable-ve-disable-nasil-yapilir.png)
![Yazılım Kodu Kanalına Abone Olun](https://yazilimkodu.com/wp-content/uploads/2022/03/yazilim-kodu-youtube-kanali.jpg)
Herkese merhaba,
Bu yazıda CKEditor’de editörün Enable ya da Disable yapılması hakkında bilgi vereceğim.
Aşağıdaki kod yardımıyla siz de bu işlemi rahatlıkla yapabilirsiniz.
HTML Kodları
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title></title>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script src="https://cdn.ckeditor.com/4.16.2/standard/ckeditor.js"></script>
</head>
<body>
<h1>CKEditor Örneği</h1>
<button id="disableyap">CKEditor'u Disable Yap</button>
<button id="enableyap">CKEditor'u Enable Yap</button>
<textarea id="editorornegi" name="editorornegi"></textarea>
</body>
</html>
CSS Kodları
#disableyap{
margin-bottom:10px;
background-color:red;
color:white;
padding:10px;
border: none;
padding: 15px 32px;
text-align: center;
text-decoration: none;
display: inline-block;
}
#enableyap{
margin-bottom:10px;
background-color:green;
color:white;
padding:10px;
border: none;
padding: 15px 32px;
text-align: center;
text-decoration: none;
display: inline-block;
}
JQUERY Kodları
CKEDITOR.replace('editorornegi');
$( document ).ready(function() {
$("#disableyap").click(function(){
CKEDITOR.instances['editorornegi'].setReadOnly(true);
});
$("#enableyap").click(function(){
CKEDITOR.instances['editorornegi'].setReadOnly(false);
});
});
[codepen_embed height=300 theme_id=1 slug_hash=’YzxdpZP’ user=’yavuzselimkart’ default_tab=’html’ animations=’run’][/codepen_embed]
Herkese çalışma hayatında ve yaşamında başarılar kolaylıklar.