第60篇一对多之学生端私有白板图片保存及学生传数组过去不再单张传周三

本文主要是介绍第60篇一对多之学生端私有白板图片保存及学生传数组过去不再单张传周三,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

关键词:学生端私有白板图片保存,学生传数组过去不再单张传

一、私有白板向老师端传图片数据

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)问题描述

    现在学生端获取私有白板上图片时,学生点一次“下一张”,这张图片就上传到了老师端,并清空了白板,但没写东西,再次点的话,可能就上传了一张空页到老师端,需要控制一下。

1.3学生端私有白板图片保存

  1描述

学生端私有白板,学生要保存一份过往图片,供自己查看。

2实现代码如下:

  adiv及查看按钮如下:----------------------student.html中

        <divid="picWrap_student_private">

        </div>

<li><a id="seeStuPriWB"οnclick="getStuPriWB();">查看</a></li>

  b控制函数----------------------student.html中

    //2)获取私有白板图片数据供学生自己查看--------------------------------------2)

    function getStuPriWB() {

        var content =$("#picWrap_student_private").html();

       if(isArray(stuPriDataURLArr)&&stuPriDataURLArr.length){

            for(var i = 0; i<stuPriDataURLArr.length; i++){

                var dataURLPri= stuPriDataURLArr[i];

                varpageIndexPri = i + 1;

                varimgContentPri = ' <divclass="img_div_student_private"><img  id= "student_arr_base64_img_pri' +pageIndexPri + '" name="thumbnail_student_pri"class="tea_base64_student_pri tea_base64_select_student_pri"src="' + dataURLPri + '"><divclass="page_index_div_student_private">' + pageIndexPri +'</div> </div>';

               $(imgContentPri).appendTo($("#picWrap_student_private"));

            }

        }

    }

注:还有一个问题是,学生在查看私有白板时,允许他修改,并且能把修改的图片替换掉原来的图片上传老师端,还要在学生端私有白板主页上显示。

1.4 老师拉学生私有白板到共享白板上

1描述

  老师查看学生的私有白板上的内容,要给学生讲时,要拉到共享白板上去。

2学生传数组过去,不再单张传

  实现了代码如下:

a.学生端每次点下一张存到数组里---student.html

//3)学生端私有白板每次点下一张,图片存入一个数组中,并清空白板-----------------3)    stuPriDataURLArr = newArray();

   function studentPriDataURL(){

       designer.saveImgPrivate('image/png',studentId,function(dataURL,studentId) {

           stuPriDataURLArr.push(dataURL);

       });

       //清空学生端私有白板

       designer.undoPrivate();

    }

 

b.老师要看哪个学生的作业,先发消息请求--------index.html

  $('#btn-getDataURL_StuPri').click(function() {

             connection.send({askStudentId:1001});

   });

c.id为1001的学生接到消息后,把数组传过去----student.html

   if (event.data.askStudentId == studentId) {

       connection.send({

           studentPri: true,

           studentId:studentId,

           stuPriDataURLArr: stuPriDataURLArr

       });

    }

d.老师收到数组后,展示出来--------------------index.html

   //获取指定学生私有白板图片数组并展示

   if (event.data.studentPri) {

       //把学生id及学生传过来的私有白板图片追加到数组中,供老师查看

       var stuPriUrlIdArray = event.data.stuPriDataURLArr;

       if(isArray(stuPriUrlIdArray) && stuPriUrlIdArray.length)

       for (var i = 0; i < stuPriUrlIdArray.length; i++) {

           if(isArray(stuPriUrlIdArray)){

                              dataURL_Pri =stuPriUrlIdArray[i];

                                   var j = i+1;

                                   varpageIndexPri = i + 1;

                                   varimgContentPri = ' <span class="img_divStuPritea_base64_selectStuPri"><img id= "arr_base64_imgStuPri' + j + '"src = "'+dataURL_Pri+'" name="thumbnailStuPri" class="tea_base64StuPri"><span class="page_index_divStuPri">' + pageIndexPri +'</span> </span>';

                                   $(imgContentPri).appendTo($("#picWrapStuPriPic.picContentStuPri"));

                                   $(".tea_base64StuPri").off("click");

                                   $(".tea_base64StuPri").on("click",onImgClickPrivate);

           }

      }

        stuPriUrlIdArray = [];

       return;

    }

3)学生私有白板数组加到老师共享白板上去

二、php

2.1PHP array_search() 函数

1定义和用法

array_search() 函数在数组中搜索某个键值,并返回对应的键名。

2语法

array_search(value,array,strict)

3)看个例子一如下:

注:这个函数用于搜索一个数组中的值,返回一个键名,第三个参数(默认为false)为true,则比较值和类型,为false则只比较值。为false时,如果存在多个相同的值,则仅返回最前面的那个,如下:

2017年3月1日星期三

这篇关于第60篇一对多之学生端私有白板图片保存及学生传数组过去不再单张传周三的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/587305

相关文章

Java 字符数组转字符串的常用方法

《Java字符数组转字符串的常用方法》文章总结了在Java中将字符数组转换为字符串的几种常用方法,包括使用String构造函数、String.valueOf()方法、StringBuilder以及A... 目录1. 使用String构造函数1.1 基本转换方法1.2 注意事项2. 使用String.valu

C#中图片如何自适应pictureBox大小

《C#中图片如何自适应pictureBox大小》文章描述了如何在C#中实现图片自适应pictureBox大小,并展示修改前后的效果,修改步骤包括两步,作者分享了个人经验,希望对大家有所帮助... 目录C#图片自适应pictureBox大小编程修改步骤总结C#图片自适应pictureBox大小上图中“z轴

使用Python将长图片分割为若干张小图片

《使用Python将长图片分割为若干张小图片》这篇文章主要为大家详细介绍了如何使用Python将长图片分割为若干张小图片,文中的示例代码讲解详细,感兴趣的小伙伴可以跟随小编一起学习一下... 目录1. python需求的任务2. Python代码的实现3. 代码修改的位置4. 运行结果1. Python需求

JAVA中整型数组、字符串数组、整型数和字符串 的创建与转换的方法

《JAVA中整型数组、字符串数组、整型数和字符串的创建与转换的方法》本文介绍了Java中字符串、字符数组和整型数组的创建方法,以及它们之间的转换方法,还详细讲解了字符串中的一些常用方法,如index... 目录一、字符串、字符数组和整型数组的创建1、字符串的创建方法1.1 通过引用字符数组来创建字符串1.2

使用 Python 和 LabelMe 实现图片验证码的自动标注功能

《使用Python和LabelMe实现图片验证码的自动标注功能》文章介绍了如何使用Python和LabelMe自动标注图片验证码,主要步骤包括图像预处理、OCR识别和生成标注文件,通过结合Pa... 目录使用 python 和 LabelMe 实现图片验证码的自动标注环境准备必备工具安装依赖实现自动标注核心

vue如何监听对象或者数组某个属性的变化详解

《vue如何监听对象或者数组某个属性的变化详解》这篇文章主要给大家介绍了关于vue如何监听对象或者数组某个属性的变化,在Vue.js中可以通过watch监听属性变化并动态修改其他属性的值,watch通... 目录前言用watch监听深度监听使用计算属性watch和计算属性的区别在vue 3中使用watchE

Java操作xls替换文本或图片的功能实现

《Java操作xls替换文本或图片的功能实现》这篇文章主要给大家介绍了关于Java操作xls替换文本或图片功能实现的相关资料,文中通过示例代码讲解了文件上传、文件处理和Excel文件生成,需要的朋友可... 目录准备xls模板文件:template.xls准备需要替换的图片和数据功能实现包声明与导入类声明与

基于C#实现将图片转换为PDF文档

《基于C#实现将图片转换为PDF文档》将图片(JPG、PNG)转换为PDF文件可以帮助我们更好地保存和分享图片,所以本文将介绍如何使用C#将JPG/PNG图片转换为PDF文档,需要的可以参考下... 目录介绍C# 将单张图片转换为PDF文档C# 将多张图片转换到一个PDF文档介绍将图片(JPG、PNG)转

Qt QWidget实现图片旋转动画

《QtQWidget实现图片旋转动画》这篇文章主要为大家详细介绍了如何使用了Qt和QWidget实现图片旋转动画效果,文中的示例代码讲解详细,感兴趣的小伙伴可以跟随小编一起学习一下... 一、效果展示二、源码分享本例程通过QGraphicsView实现svg格式图片旋转。.hpjavascript

使用opencv优化图片(画面变清晰)

文章目录 需求影响照片清晰度的因素 实现降噪测试代码 锐化空间锐化Unsharp Masking频率域锐化对比测试 对比度增强常用算法对比测试 需求 对图像进行优化,使其看起来更清晰,同时保持尺寸不变,通常涉及到图像处理技术如锐化、降噪、对比度增强等 影响照片清晰度的因素 影响照片清晰度的因素有很多,主要可以从以下几个方面来分析 1. 拍摄设备 相机传感器:相机传