找回密码
 立即注册
搜索
热搜: 活动 交友 discuz
查看: 13|回复: 0

jquery文本编辑器插件

[复制链接]

32万

主题

0

回帖

96万

积分

超级版主

积分
964681
发表于 2025-3-14 12:03:29 | 显示全部楼层 |阅读模式
软件标签:  jquery   编程辅助
jquery编辑器插件是froala wysiwyg editor。这是一个基于html5的轻量级jquery wysiwyg文本编辑器。绿色资源网提供免费使用版本,欢迎下载
jquery编辑器介绍
jquery是一个快速、简洁的javascript框架,是继prototype之后又一个优秀的javascript代码库(或javascript框架)。jquery设计的宗旨是“write less,do more”,即倡导写更少的代码,做更多的事情。它封装javascript常用的功能代码,提供一种简便的javascript设计模式,优化html文档操作、事件处理、动画设计和ajax交互。

jquery的核心特性可以总结为:具有独特的链式语法和短小清晰的多功能接口;具有高效灵活的css选择器,并且可对css选择器进行扩展;拥有便捷的插件扩展机制和丰富的插件。jquery兼容各种主流浏览器,如ie 6.0+、ff 1.5+、safari 2.0+、opera 9.0+等。
jquery编辑器插件实现中文菜单和上传图片保存到本地路径:
<script src="js/editor/libs/jquery-1.11.1.min.js"></script>

<script src="js/editor/froala_editor.min.js"></script>

<!--[if lt ie 9]>

<script src="../js/froala_editor_ie8.min.js"></script>

<![endif]-->

<script src="js/editor/plugins/tables.min.js"></script>

<script src="js/editor/plugins/lists.min.js"></script>

<script src="js/editor/plugins/colors.min.js"></script>

<script src="js/editor/plugins/media_manager.min.js"></script>

<script src="js/editor/plugins/font_family.min.js"></script>

<script src="js/editor/plugins/font_size.min.js"></script>

<script src="js/editor/plugins/block_styles.min.js"></script>

<script src="js/editor/plugins/video.min.js"></script>

<script src="js/editor/langs/zh_cn.js"></script>

<script>

$(function () {

$(#edit).editable({

inlinemode: false,

alwaysblank: true,

language: "zh_cn",

direction: "ltr",

allowedimagetypes: ["jpeg", "jpg", "png", "gif"],

autosave: true,

autosaveinterval: 2500,

saveurl: hander/froalahandler.ashx,

saveparams: { postid: "123" },

spellcheck: true,

plainpaste: true,

imagebuttons: ["floatimageleft", "floatimagenone", "floatimageright", "linkimage", "replaceimage", "removeimage"],

imageuploadurl: hander/froalahandler.ashx,

imageparams: { postid: "123" },

enablescript: false



})

})
;
</script>



<script>

$(function(){

$(#edit).editable({

inlinemode: false, alwaysblank: true,

language: "zh_cn",

imageuploadurl: lib/imgupload.php,//上传到本地服务器

imageuploadparams: {id: "edit"},

imagedeleteurl: lib/delete_image.php,//删除图片

imagesloadurl: lib/load_images.php//管理图片

}).on(editable.afterremoveimage, function (e, editor, $img) {

// set the image source to the image delete params.

editor.options.imagedeleteparams = {src: $img.attr(src)};

// make the delete request

. ? ? ? ? ? ? ?editor.deleteimage($img);

});

});

</script>
jquery编辑器上传图片服务器端的php代码:
<?php

// allowed extentions.

$allowedexts = array("gif", "jpeg", "jpg", "png");

// get filename.

$temp = explode(".", $_files["file"]["name"]);

// get extension.

$extension = end($temp);

// an image check is being done in the editor but it is best to

// check that again on the server side.

// do not use $_files["file"]["type"] as it can be easily forged.

$finfo = finfo_open(fileinfo_mime_type);

$mime = finfo_file($finfo, $_files["file"]["tmp_name"]);

if ((($mime == "image/gif") ? ?|| ($mime == "image/jpeg") ? ?|| ($mime == "image/pjpeg") ? ?|| ($mime == "image/x-png") ? ?|| ($mime == "image/png")) ? ?&& in_array($extension, $allowedexts)) {

// generate new random name.

$name = sha1(microtime()) . "." . $extension;

// save file in the uploads folder.

move_uploaded_file($_files["file"]["tmp_name"], "../uploads/" . $name);

// generate response.

$response = new stdclass;

$response->link = "../../uploads/" . $name;

echostripslashes(json_encode($response));

}

?>


"bigpic">安装详细截图
aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

Archiver|手机版|小黑屋|ziyuan80.com

GMT+8, 2025-8-11 11:33 , Processed in 0.071412 second(s), 19 queries .

Powered by Discuz! X3.5

© 2001-2025 Discuz! Team.

快速回复 返回顶部 返回列表