ajax 实现网页视频无刷新评论

最新推荐文章于 2022-08-04 14:51:22 发布

duoduo220

最新推荐文章于 2022-08-04 14:51:22 发布

阅读量911

点赞数

分类专栏：代码再现文章标签： ajax xmlhttprequest 引擎 flash url function

本文链接：https://blog.csdn.net/wo1354691371/article/details/7319406

版权

代码再现专栏收录该内容

18 篇文章 0 订阅

订阅专栏

ajax-youku.html

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

<head>

<title>ajax实现无刷新评论</title>

#comment{

width:400px;

height:200px;

background-color:#3F6;}

</style>

function getComment(){

//初始化AJAX引擎

var xhr=new XMLHttpRequest();

//获取DIV 的ID

var div=document.getElementById("comment");

//获取文本框的内容

var comment=document.getElementById("com");

//初始化URL

var url="ajax-kugou-server.php?comment="+encodeURI(comment.value+"&r="+Math.random());

//打开引擎

xhr.open("get",url,true);

//发送请求

xhr.send(null);

//监听readystatue的改变，每次改变都会执行

xhr.onreadystatechange=function(){

if(xhr.readyState==4){

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

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

p.appendChild(text);

div.appendChild(p);

}

</script>

</head>

<body>

欣赏视频：

<hr>

<div>

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

</div>

</object>

</object>

swfobject.registerObject("FlashID");

</script>

<hr>

<hr />

</textarea>

</div>

</body>

</html>

Ajax-youku-server.php

<?php

//省略了插入数据库的步骤

echo $_GET['comment'];

ajaxUtil.js文件

function get(url1,params,methodName){

ajax使用的基本步骤：

1、初始化ajax引擎

2、封装url（设定要请求的路径）

3、打开ajax引擎（同步方式、异步的方式；本次传输使用get还是post）

4、将要请求的信息通过引擎发送到服务器进行处理

5、监听服务器返回给ajax引擎的处理状态

6、判断是否交互完毕，如果交互完毕则取出返回的数

//初始化ajax引擎

var xhr = new XMLHttpRequest();//这种方式只针对ie浏览器，并且ie6以下还有问题。

var url=url1+"?"+params+"&r="+Math.random();

//alert(url);

//打开引擎

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

//发送请求

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

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

xhr.onreadystatechange=function (){

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

if(xhr.readyState==4){

//动态调用方法，为什么说是动态呢？方法的名称是个变量methodName

methodName(xhr);

}

//$$（）方法用于方便取出 id="id" 的对象

function $$(id){

return document.getElementById(id);

}

duoduo220

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
ajax 实现网页视频无刷新评论

ajax-youku.htmlajax实现无刷新评论#comment{ width:400px; height:200px; background-color:#3F6;} function getComment(){ //初始化AJAX引擎 var xhr=new XMLHtt
复制链接

扫一扫

专栏目录