怎么才能把图片弄到网页上？前端页面的插件有哪些？

怎么才能把图片弄到网页上？

首先回答下题主的问题:

①是否可以实现，以及如何实现？

答:可以实现,而且是前端实现,详细说明在下面

②如果可以实现，对于用户上传的图片格式有无限制？（PNG/JPG等）

答:

没有任何限制

以下是详细说明:

前端用

html2canvas.js

可以把html转成

canvas

最后输出

base64

码图片

用法非常简单.
注意:示例中使用了

jquery

库.

使用以下代码生成:

第一个参数是要捕捉的区域

第二个参数负责生成

生成的

base64

图片码类似这样



如果题主的后端需要保存可以用PHP的GD库处理这个base64然后直接输出成图片文件
前端只要将base64放到a标签的href里让用户点击即可查看/下载

可以到我写的

工作流程图

里看看效果
首先拖几个控件到设计区域
然后点击 保存 - 保存为图片 Download

一张图片就出来了
不过它是不支持CSS3部分属性的
但是根据题主的描述,应该不会用到CSS3,所以

html2canvas+GD库

足够用了

前端页面的插件有哪些？

工具类

方便操作对象，数组等的工具库

underscore.js

lo-dash 与underscore.js的api基本一致。与underscore比其优势是，效率高；可自定义构建

Sugar 在原生对象上增加一些工具方法

functional.js 提够了一些Curry的支持

Watch.js 监视对象或属性的变化

bacon.js 函数式编程，cool

streamjs 用流的方式来对数组，对象进行系列操作

异步流程控制

eventproxy 朴灵出品

Arbiter.js 详细

发布订阅

q Promise风格的

Async.js

mock

Mock.js 生成随机数据和mock Ajax 请求

jquery-mockjax mock ajax请求

时间库

moment

datejs

浏览器探测

Bowser 探测具体浏览器和版本

ua-parser-js 探测具体浏览器和版本，操作系统，设备类型等

调试

console-polyfill 能放心的使用 console.log()之类的console方法

log 让控制台输出的log有样式

Konsole.js 在页面的一个元素里输出log信息 详细

uri.js uri操作

cookie 增删改cookie的工具库

director 前端路由库 详细

BigDecimal.js 提高精度的数字操作

JSDoc 根据javascript文件中注释的信息，生成API文档 详细

hotkeys 键盘事件的封装