第62篇一对多之学生端修改私有白板并保存及array_shift
2017-03-04 10:37
323 查看
关键词:学生端修改私有白板并保存, array_shift
一、私有白板向老师端传图片数据
1.1 服务器运行平台
老师端:https://localhost:9101/demos/index.html?roomid=888&t=600
学生一:
https://localhost:9101/demos/student.html?studentId=1001&userAvatar=http://123.57.206.36:8003/uploadfiles/2016/11/1479740395ZMJkiF.jpg&t=600#888
学生二:
https://localhost:9101/demos/student.html?studentId=1002&userAvatar=http://123.57.206.36:8003/uploadfiles/2016/11/1480494624FDjMGetutor.png&t=600#888
学生三:
https://localhost:9101/demos/student.html?studentId=1003&userAvatar=http://123.57.206.36:8003/uploadfiles/2016/11/1480475198N2F0kntutor.png&t=600#888
1.2 学生端修改私有白板并保存
1)分析:
单击过往图片的任一张,需要做两件事:
一是上传到当前私有白板,单击另一张时替换当前id的dataURL;
二是拿着id,更新数组,方便下一次查看时,更新。
2)现在想想
完全可以按老师端来做,所以,推倒重来,现在保存已实现,页码显示还有点问题。相关代码如下:
var globelIdStuPri = 0;
$('#btn-getDataURL-studentPri').click(function(){//--------------------------aaaa
//当老师端新建白板时,要向学生端发个消息,也新建白板
stu_pri_arr_base64_img_i =$("#picWrap_student_private .picContentStuPrivate").children().length- 1;
saveCanvasStuPri(globelIdStuPri);//主要保存的是dataURL
// return;
designer.undo('all');
createImgStuPri(stu_pri_arr_base64_img_i);
globelIdStuPri = stu_pri_arr_base64_img_i;
});
stuPriDataURLpage = 0;
stuPriDataURLArr = new Array();
function saveCanvasStuPri(globelIdStuPri){//------------------------------bbbb
designer.saveImgPrivate('image/png',globelIdStuPri,function(dataURL,globelIdStuPri) {
stuPriDataURLArr.push([dataURL,globelIdStuPri]);
refreshStuPri(dataURL, globelIdStuPri);
$(".tea_base64_student_pri").off("click");
$(".tea_base64_student_pri").on("click",stuOnImgClickPrivate);
});
//清空学生端私有白板
designer.undoPrivate();
stuPriDataURLpage++;
}
functionrefreshStuPri(dataURL, globelIdStuPri){//------------------------------------------------cccc
$("#student_arr_base64_img_pri" +globelIdStuPri).attr("src", dataURL);
}
functioncreateImgStuPri(imgId) {
$("[name =thumbnail_student_pri]").parent().removeClass("tea_base64_student_pri");
varpageIndexPri = imgId + 1;
var imgContentPri = ' <divclass="img_div_student_privatetea_base64_student_pri"><img id= "student_arr_base64_img_pri'
+ pageIndexPri + '"name="thumbnail_student_pri"class="tea_base64_student_pri"><divclass="page_index_div_student_private">' + pageIndexPri +'</div> </div>';
$(imgContentPri).appendTo($("#picWrap_student_private.picContentStuPrivate"));
}
运行效果如下:
2)调整页码问题
调整成功,代码如下:
a)单击函数如下:
var globelIdStuPri = 0;
var stu_pri_arr_base64_img_i = 1;
$('#btn-getDataURL-studentPri').click(function(){//-------------------------------aaaa
saveCanvasStuPri(globelIdStuPri);//主要保存的是dataURL
createImgStuPri(stu_pri_arr_base64_img_i);
globelIdStuPri = stu_pri_arr_base64_img_i;
stu_pri_arr_base64_img_i =$("#picWrap_student_private").children().length+1;
});
b)保存函数(saveCanvasStuPri)如下:
function saveCanvasStuPri(globelIdStuPri){//------------------------------------bbbb
designer.saveImgPrivate('image/png',globelIdStuPri,function(dataURL,globelIdStuPri) {
globelIdStuPri =globelIdStuPri+1;
$("#student_arr_base64_img_pri" +globelIdStuPri).attr("src", dataURL);
});
designer.undoPrivate();
}
注:主要功能就是先给指定的div中的图片赋个dataURL,就是src属性。
c)追加函数(createImgStuPri)如下:
functioncreateImgStuPri(imgId) {
$("[name =thumbnail_student_pri]").parent().removeClass("tea_base64_student_pri");
var imgContentPri = ' <divclass="img_div_student_private tea_base64_student_pri"><img id= "student_arr_base64_img_pri'
+ imgId + '"name="thumbnail_student_pri"class="tea_base64_student_pri"><divclass="page_index_div_student_private">' + imgId + '</div></div>';
$(imgContentPri).appendTo($("#picWrap_student_private"));
}
注:我是在div中追加各个小div
d)效果如下:
3)单击保存
描述:单击一张图片,修改后,单击另一张,保存到原来id下。
二、php
2.1 PHP array_shift() 函数
1)定义和用法
array_shift() 函数用于删除数组中的第一个元素,并返回被删除的元素。
注释:如果键名是数字的,所有元素都将获得新的键名,从 0 开始,并以 1 递增(参见下面实例)。
2)语法
array_shift(array)
3)看个例子一
注:这个函数的作用是取出数组中第一个元素,并且输出值。原数组少一个元素,针对数值型的数组,键名重新索引。不管原来的数组键名大小,再看个例子如下:
4)看个例子二----字母型的键名
注:对于字母型的键名,不进行重新索引。对于数字字母混合型的键名,数字型的会重新索引。
2017年3月3日星期五
一、私有白板向老师端传图片数据
1.1 服务器运行平台
老师端:https://localhost:9101/demos/index.html?roomid=888&t=600
学生一:
https://localhost:9101/demos/student.html?studentId=1001&userAvatar=http://123.57.206.36:8003/uploadfiles/2016/11/1479740395ZMJkiF.jpg&t=600#888
学生二:
https://localhost:9101/demos/student.html?studentId=1002&userAvatar=http://123.57.206.36:8003/uploadfiles/2016/11/1480494624FDjMGetutor.png&t=600#888
学生三:
https://localhost:9101/demos/student.html?studentId=1003&userAvatar=http://123.57.206.36:8003/uploadfiles/2016/11/1480475198N2F0kntutor.png&t=600#888
1.2 学生端修改私有白板并保存
1)分析:
单击过往图片的任一张,需要做两件事:
一是上传到当前私有白板,单击另一张时替换当前id的dataURL;
二是拿着id,更新数组,方便下一次查看时,更新。
2)现在想想
完全可以按老师端来做,所以,推倒重来,现在保存已实现,页码显示还有点问题。相关代码如下:
var globelIdStuPri = 0;
$('#btn-getDataURL-studentPri').click(function(){//--------------------------aaaa
//当老师端新建白板时,要向学生端发个消息,也新建白板
stu_pri_arr_base64_img_i =$("#picWrap_student_private .picContentStuPrivate").children().length- 1;
saveCanvasStuPri(globelIdStuPri);//主要保存的是dataURL
// return;
designer.undo('all');
createImgStuPri(stu_pri_arr_base64_img_i);
globelIdStuPri = stu_pri_arr_base64_img_i;
});
stuPriDataURLpage = 0;
stuPriDataURLArr = new Array();
function saveCanvasStuPri(globelIdStuPri){//------------------------------bbbb
designer.saveImgPrivate('image/png',globelIdStuPri,function(dataURL,globelIdStuPri) {
stuPriDataURLArr.push([dataURL,globelIdStuPri]);
refreshStuPri(dataURL, globelIdStuPri);
$(".tea_base64_student_pri").off("click");
$(".tea_base64_student_pri").on("click",stuOnImgClickPrivate);
});
//清空学生端私有白板
designer.undoPrivate();
stuPriDataURLpage++;
}
functionrefreshStuPri(dataURL, globelIdStuPri){//------------------------------------------------cccc
$("#student_arr_base64_img_pri" +globelIdStuPri).attr("src", dataURL);
}
functioncreateImgStuPri(imgId) {
$("[name =thumbnail_student_pri]").parent().removeClass("tea_base64_student_pri");
varpageIndexPri = imgId + 1;
var imgContentPri = ' <divclass="img_div_student_privatetea_base64_student_pri"><img id= "student_arr_base64_img_pri'
+ pageIndexPri + '"name="thumbnail_student_pri"class="tea_base64_student_pri"><divclass="page_index_div_student_private">' + pageIndexPri +'</div> </div>';
$(imgContentPri).appendTo($("#picWrap_student_private.picContentStuPrivate"));
}
运行效果如下:
2)调整页码问题
调整成功,代码如下:
a)单击函数如下:
var globelIdStuPri = 0;
var stu_pri_arr_base64_img_i = 1;
$('#btn-getDataURL-studentPri').click(function(){//-------------------------------aaaa
saveCanvasStuPri(globelIdStuPri);//主要保存的是dataURL
createImgStuPri(stu_pri_arr_base64_img_i);
globelIdStuPri = stu_pri_arr_base64_img_i;
stu_pri_arr_base64_img_i =$("#picWrap_student_private").children().length+1;
});
b)保存函数(saveCanvasStuPri)如下:
function saveCanvasStuPri(globelIdStuPri){//------------------------------------bbbb
designer.saveImgPrivate('image/png',globelIdStuPri,function(dataURL,globelIdStuPri) {
globelIdStuPri =globelIdStuPri+1;
$("#student_arr_base64_img_pri" +globelIdStuPri).attr("src", dataURL);
});
designer.undoPrivate();
}
注:主要功能就是先给指定的div中的图片赋个dataURL,就是src属性。
c)追加函数(createImgStuPri)如下:
functioncreateImgStuPri(imgId) {
$("[name =thumbnail_student_pri]").parent().removeClass("tea_base64_student_pri");
var imgContentPri = ' <divclass="img_div_student_private tea_base64_student_pri"><img id= "student_arr_base64_img_pri'
+ imgId + '"name="thumbnail_student_pri"class="tea_base64_student_pri"><divclass="page_index_div_student_private">' + imgId + '</div></div>';
$(imgContentPri).appendTo($("#picWrap_student_private"));
}
注:我是在div中追加各个小div
d)效果如下:
3)单击保存
描述:单击一张图片,修改后,单击另一张,保存到原来id下。
二、php
2.1 PHP array_shift() 函数
1)定义和用法
array_shift() 函数用于删除数组中的第一个元素,并返回被删除的元素。
注释:如果键名是数字的,所有元素都将获得新的键名,从 0 开始,并以 1 递增(参见下面实例)。
2)语法
array_shift(array)
3)看个例子一
注:这个函数的作用是取出数组中第一个元素,并且输出值。原数组少一个元素,针对数值型的数组,键名重新索引。不管原来的数组键名大小,再看个例子如下:
4)看个例子二----字母型的键名
注:对于字母型的键名,不进行重新索引。对于数字字母混合型的键名,数字型的会重新索引。
2017年3月3日星期五
相关文章推荐
- 第64篇一对多之学生端修改私有白板并保存(三)及私有白板传到老师端
- 第60篇一对多之学生端私有白板图片保存及学生传数组过去不再单张传周三
- 第53篇一对多实现之学生白板传图片到服务器(三)及array_pad
- 第72篇一对多之优化实时共享私有白板最后一页(三)两个学生相互刷新解决及追加div传参数周一
- docker 基于现有镜像修改后保存,上传私有仓库
- docker 基于现有镜像修改后保存,上传私有仓库
- 第73篇一对多之两个学生相互刷新解决(二)重写最后一张白板的刷新及array_udiff_assoc及array_udiff_uassoc
- 第56篇一对多实现之私有白板向老师端传图片数据(三)仿制传图片dataURL及array_replace及array_replace_recursive
- 第55篇一对多实现之私有白板向老师端传图片数据(二)及array_reduce
- 第89篇一对多之学生端私有白板样式及学生举手提问及学生发消息报错
- TortoiseSVN修改或清除已保存的密码。
- 解决sql server不允许保存表结构修改的问题
- Flex中利用ByteArray与BitmapData互相转换实现图片的二进制保存与复原[转]
- centos下修改文件后如何保存退出
- linux下vi命令修改文件及保存等使用方法整理
- opencv2.4.9学习:加载、修改、保存一个图片
- 保存远程图片函数修改正版
- 第十四周项目2——【项目2-用文件保存的学生名单】
- 学生信息管理系统之【修改信息窗口】
- extjs 保存和修改数据到数据库