canvas绘制文本内容自动换行的实现代码html5实现点击弹出图片功能html5 录制mp3音频支持采样率和比特率设置html5表单的required属性使用html5调用摄像头实例代码HTML5页面音频自动播放的实现方式Html5大屏数据可视化开发的实现html实现弹窗的实例HTML5来实现本地文件读取和写入的实现方法HTML 罗盘式时钟的实现HTML5简单实现添加背景音乐的几种方法

 // 文字自动换行 function textPrewrap(ctx, content, drawX, drawY, lineHeight, lineMaxWidth, lineNum) { var drawTxt = ''; // 当前绘制的内容 var drawLine = 1; // 第几行开始绘制 var drawIndex = 0; // 当前绘制内容的索引 // 判断内容是否可以一行绘制完毕 if(ctx.measureText(content).width <= lineMaxWidth) { ctx.fillText(content.substring(drawIndex, i), drawX, drawY); } else { for (var i = 0; i <= content.length; i++) { drawTxt += content[i]; if (ctx.measureText(drawTxt).width > lineMaxWidth) { if (drawLine === lineNum) { // 最后一行添加省略号 ctx.fillText(content.substring(drawIndex, i) + '...', drawX, drawY); break; } else { // 不是最后一行的情况 ctx.fillText(content.substring(drawIndex, i + 1), drawX, drawY); drawIndex = i + 1; // 记录当前行最后一个字符串的下一个idnex，用于绘制下行第一个字 drawLine += 1; // 行数+1 drawY += lineHeight; // 绘制内容的y坐标对应增加行高 drawTxt = ''; // 重置绘制的内容 } } } } }