用ajax实现仿优酷的视频播放评论不进行刷新

<!DOCTYPE html PUBLIC "-//W3C//DTDXHTML 1.0 Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<htmlxmlns="http://www.w3.org/1999/xhtml">

<head>

<metahttp-equiv="Content-Type" content="text/html;charset=utf-8" />

<title>无标题文档</title>

<style>

 #comment{

          width:500px;

          height:400px;

          background-color:#FC9;

          

          }

 

</style>

<script language="javascript"type="text/javascript">

 function getComment(){

          /*

          ajax无刷新的评论

          1、发布的评论,五刷新的显示到下面的区域

          2、通过ajax把内容存到服务器上

          3、获取服务器的数据,显示到评论区域

          

          */

          //初始化ajax引擎

          var xhr = new XMLHttpRequest();

          //这种方式只针对IE浏览器,并且IE6以下还有问题

          varcomment=document.getElementById("com");

          vardiv=document.getElementById("comment");

          //初始化url

          varurl="ajax-youku-server.php?comment="+comment.value+"&r="+Math.random();

          //打开引擎

          xhr.open("get",url,true);//readyState=1

          //发送请求

          xhr.send(null);//readyState=2

          //监听readyState值的改变,每次改变都会执行下面的函数

          xhr.onreadystatechange=function (){

                    //如果等于4,表名交互完毕,我们可以取出服务器返回的内容

                    if(xhr.readyState==4){

                   //alert(xhr.responseText);

                   //产生一个段落标记

                             var p=document.createElement("p");

                             //产生一个文本节点

                             var text=document.createTextNode("评论内容"+xhr.responseText);

                             //将文本添加到p元素<p></p>

                             p.appendChild(text);

                             //将段落标记追加到div中

                             div.appendChild(p);

                             }

                    

                    }

          

          }

 

 

 

</script>

<scriptsrc="../Scripts/swfobject_modified.js"type="text/javascript"></script>

 

</head>

 

<body>

<object id="FlashID"classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"width="550" height="340">

 <param name="movie" value="1.swf" />

 <param name="quality" value="high" />

 <param name="wmode" value="opaque" />

 <param name="swfversion" value="9.0.45.0" />

 <!-- 此 param 标签提示使用 Flash Player 6.0 r65 和更高版本的用户下载最新版本的Flash Player。如果您不想让用户看到该提示,请将其删除。-->

 <param name="expressinstall"value="../Scripts/expressInstall.swf" />

 <!-- 下一个对象标签用于非 IE 浏览器。所以使用 IECC 将其从 IE 隐藏。 -->

 <!--[if !IE]>-->

 <object type="application/x-shockwave-flash" data="../飘雪动画_场景 1.swf"width="550" height="340">

   <!--<![endif]-->

   <param name="quality" value="high" />

   <param name="wmode" value="opaque" />

   <param name="swfversion" value="9.0.45.0" />

   <param name="expressinstall"value="../Scripts/expressInstall.swf" />

   <!-- 浏览器将以下替代内容显示给使用 FlashPlayer 6.0 和更低版本的用户。 -->

   <div>

     <h4>此页面上的内容需要较新版本的 AdobeFlash Player。</h4>

     <p><ahref="http://www.adobe.com/go/getflashplayer"><imgsrc="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif"alt="获取 Adobe FlashPlayer" /></a></p>

   </div>

   <!--[if !IE]>-->

 </object>

 <!--<![endif]-->

</object>

<script language="javascript"type="text/javascript">

swfobject.registerObject("FlashID");

</script>

</body>

<hr>

 

<textarea cols="45"id="com" rows="7"></textarea><br /><br/>

<input type="button"value="评论"οnclick="getComment()" />

 

<hr />

<divid="comment"></div>

</html>


  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值