1)调用kindeditor图片上传:
<script>
//这里是编辑器
var editor;
KindEditor.ready(function (K) {
editor = K.create(‘textarea[name="content"]‘, {
allowFileManager: true,
resiseMode: 1
});
//这里是监听按钮点击事件 然后在初始化点击按钮弹窗上传图片的基本配置
K(‘#image‘).click(function () {
editor.loadPlugin(‘image‘, function () {
editor.plugin.imageDialog({
imageUrl: K(‘#url‘).val(),
clickFn: function (url, title, width, height, border, align) {
K(‘#url‘).val(url);
editor.hideDialog();
}
});
});
});
});
</script>
表单代码
<tr>
<td>图片:</td>
<td>
<input type="text" id="url" name="img" readonly="readonly" value=""/>
<input type="button" id="image" value="选择图片"/>
</td>
</tr>
2)调用kindeditor编辑器:
<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<script charset="utf-8" src="./ke/kindeditor.js"></script>
<script>
var editor;
KindEditor.ready(function (K) {
editor = K.create(‘textarea[name="content"]‘, {
allowFileManager: true
});
});
</script>
<body>
<form action="test.php" method="post">
<table border="1px">
<tr>
<td>1</td>
<td>2</td>
</tr>
<tr>
<td>3</td>
<td><textarea name="content" cols="5" rows="5"></textarea></td>
</tr>
<tr>
<td colspan="2">
<input type="submit" name="submit" value="submit"/>
</td>
</tr>
</table>
</form>
</body>
</html>
3)jQuery获取kindedit中的内容:
<script> $(function(){ $(‘#btnOk‘).bind(‘click‘,function(){ var name=$(‘#name‘).val(); var remark=$(document.getElementsByTagName(‘iframe‘)[0].contentWindow.document.body).html(); var data={ name:name, remark:remark } $.post(‘__URL__/add‘,data,function(msg){ if(msg==1){ alert(‘录入成功!‘); $(‘#name‘).val(""); $(document.getElementsByTagName(‘iframe‘)[0].contentWindow.document.body).html(""); //获取编辑器内容 }else{ alert(‘录入失败‘); } });//post结束 });//click结束 }); </script>
原文:http://www.cnblogs.com/gimin/p/4572849.html