第90篇一对多之学生举手提问及老师点课堂模式掉线

关键词：学生举手提问,老师点课堂模式掉线

一、一对多

1.1老师点课堂模式掉线

今天下午解决了一个问题，就是老师点课堂模式，老师和学生同时掉线，反复找原因，找不到。最后，终于发现是下面的一个字母少写了。

错误代码如下：

<a href="javasript:void(0)"class="isnow" id="onClass-btn"onclick="onClass()">课堂模式</a>

正确代码如下：

<a href="javascript:void(0)" class="isnow"id="onClass-btn" onclick="onClass()">课堂模式</a>

注：这是前端给我时，少写了一个字母，用了我一个下午的时间才找出来。看来，做程序员，细心是多少重要呀！

1.2 学生举手提问

1）来个click事件如下：----------------student.html

<a href="javascript:void(0);"class="tool-bottom-btn" id="raiseHands"

onclick="raiHand()"><span></span>举手</a>

2）raiHand()函数如下：----------------student.html

//学生举手提问

function raiHand(){

   //学生举手向老师端发消息

  connection.send({

       'mobileName':mobileName,

       'video_Id':connection.localMediaStreamId

        'raiHand':true

   });

}

3）老师端收到消息后

   //学生举手提问老师端动态追加提示消息

   if(event.data.mobileName && event.data.raiHand){

      $("#raHanQue").append('<liclass="clearfix"><img src="/static/img/end_s.png"

/><span>qhz发起举手提问</span><a href="javascript:void(0);" title="点击禁音"></a></li>');

}

追加到的<li>标签如下：

 <p>举手</p>

  <section>

     <ul id="raHanQue" class="scrollbar">

     <li class="clearfix"><imgsrc="/static/img/end_s.png" /><span>小明发起举手提问</span>

      <a href="javascript:void(0);" title="点击禁音"></a></li>

      <liclass="clearfix"><img src="/static/img/end_s.png"/><span>小明发起举手提问</span>

      <a href="javascript:void(0);" title="点击禁音"></a></li>

      </ul>

  </section>

学生端点举手后老师端显示效果如下：

4）给追加的消息加个id，方便隐藏消息

开发成功，代码如下：

a.)学生举手追加消息

   //学生举手提问老师端动态追加提示消息

   if(event.data.mobileName && event.data.raiHand){

      var mobName = event.data.mobileName;

      var VA_id = event.data.video_Id;

      raiHandId= 'VA'+VA_id;

      $("#raHanQue").append("<li id = '" +raiHandId+"'class='clearfix'><img src='/static/img/end_s.png'/><span>"+mobName+"发起举手提问</span><ahref='javascript:void(0);'onclick='removeRH(raiHandId)'title='忽略消息'></a></li>");

 

}

注：这个raiHandId必须是全局变量，因为单击函数removeRH()用到这个变量，要把这个变量传过去，因为是双引号，里面能识别变量，所以不用单独写出来。

b.) removeRH()函数如下：

         //移除举手标签

         functionremoveRH(id){

 

     $("#"+id).remove();

         }

注：单击这个标签，移除即可，说明老师不想让这个学生发言。

5）学生举手，老师让学生发言

代码如下：

   //学生举手提问老师端动态追加提示消息

   if(event.data.mobileName && event.data.raiHand){

      var mobName = event.data.mobileName;

      RHVA_id = event.data.video_Id;

      raiHandId = 'VA'+RHVA_id;

  

      $("#raHanQue").append("<li id = '" +raiHandId+"'class='clearfix'><img src='/static/img/end_s.png'onclick='openSgVA(RHVA_id)' /><span>"+mobName+"发起举手提问</span><ahref='javascript:void(0);' onclick='removeRH(raiHandId)' title='忽略消息'></a></li>");

}

注：给图片上加个函数，点击打开声音即可。这个函数是之前写的，现在用到这里来了。和点击学生视频打开声音，效果是一样的。

2017年3月31日星期五