script异步php,javascript异步编程

本文目录一览：

• 1、中使用php
• 2、js异步问题怎么解决
• 3、php 异步上传图片几种方法总结
• 4、thinkphp 怎么异步加载
• 5、script 传数据到 php

中使用php

我的理解是在js 中插入php语句，直接在要输出的地方?php php语句 ?，如果需要加‘’，就加上就ok了，不用js的拼接符号

js异步问题怎么解决

异步加载又叫非阻塞加载，浏览器在下载执行js的同时，还会继续进行后续页面的处理。主要有三种方式。

方法一：也叫Script DOM Element

(function(){

var scriptEle = document.createElement(“script”);

scriptEle.type = “text/javasctipt”;

scriptEle.async = true;

scriptEle.src = “”;

var x = document.getElementsByTagName(“head”)[0];

x.insertBefore(scriptEle, x.firstChild);

})();

async属性是HTML5中新增的异步支持。此方法被称为Script DOM Element 方法。Google Analytics 和 Google+ Badge 都使用了这种异步加载代码

(function(){;

var ga = document.createElement(‘script’);

ga.type = ‘text/javascript’;

ga.async = true;

ga.src = (‘https:’ == document.location.protocol ? ” : ”) + ‘.google-analytics.com/ga.js’;

var s = document.getElementsByTagName(‘script’)[0];

s.parentNode.insertBefore(ga, s);

})();

但是这种加载方式执行完之前会阻止onload事件的触发，而现在很多页面的代码都在onload时还执行额外的渲染工作，所以还是会阻塞部分页面的初始化处理。

方法二：onload时的异步加载

(function(){

if(window.attachEvent){

window.attachEvent(“load”, asyncLoad);

}else{

window.addEventListener(“load”, asyncLoad);

}

var asyncLoad = function(){

var ga = document.createElement(‘script’);

ga.type = ‘text/javascript’;

ga.async = true;

ga.src = (‘https:’ == document.location.protocol ? ” : ”) + ‘.google-analytics.com/ga.js’;

var s = document.getElementsByTagName(‘script’)[0];

s.parentNode.insertBefore(ga, s);

}

)();

这种方法只是把插入script的方法放在一个函数里面，然后放在window的onload方法里面执行，这样就解决了阻塞onload事件触发的问题。

注:DOMContentLoaded与load的区别。前者是在document已经解析完成，页面中的dom元素可用，但是页面中的图片，视频，音频等资源未加载完，作用同jQuery中的ready事件；后者的区别在于页面所有资源全部加载完毕。

方法三：其他方法

由于JavaScript的动态性，还有很多异步加载方法： XHR Injection、 XHR Eval、 Script In Iframe、 Script defer属性、 document.write(script tag)。

XHR Injection(XHR 注入)：通过XMLHttpRequest来获取javascript，然后创建一个script元素插入到DOM结构中。ajax请求成功后设置script.text为请求成功后返回的responseText。

//获取XMLHttpRequest对象，考虑兼容性。

var getXmlHttp = function(){

var obj;

if (window.XMLHttpRequest)

obj = new XMLHttpRequest();

else

obj = new ActiveXObject(“Microsoft.XMLHTTP”);

return obj;

};

//采用Http请求get方式;open()方法的第三个参数表示采用异步(true)还是同步(false)处理

var xmlHttp = getXmlHttp();

xmlHttp.open(“GET”, “”, true);

xmlHttp.send();

xmlHttp.onreadystatechange = function(){

if (xmlHttp.readyState == 4 xmlHttp.status == 200){

var script = document.createElement(“script”);

script.text = xmlHttp.responseText;

document.getElementsByTagName(“head”)[0].appendChild(script);

}

}

XHR Eval：与XHR Injection对responseText的执行方式不同，直接把responseText放在eval()函数里面执行。

//获取XMLHttpRequest对象，考虑兼容性。

var getXmlHttp = function(){

var obj;

if (window.XMLHttpRequest)

obj = new XMLHttpRequest();

else

obj = new ActiveXObject(“Microsoft.XMLHTTP”);

return obj;

};

//采用Http请求get方式;open()方法的第三个参数表示采用异步(true)还是同步(false)处理

var xmlHttp = getXmlHttp();

xmlHttp.open(“GET”, “”, true);

xmlHttp.send();

xmlHttp.onreadystatechange = function(){

if (xmlHttp.readyState == 4 xmlHttp.status == 200){

eval(xmlHttp.responseText);

//alert($);//可以弹出$,表明JS已经加载进来。click事件放在其它出会出问题，应该是还没加载进来

$(“#btn1”).click(function(){

alert($(this).text());

});

}

}

Script In Irame：在父窗口插入一个iframe元素，然后再iframe中执行加载JS的操作。

var insertJS = function(){alert(2)};

var iframe = document.createElement(“iframe”);

document.body.appendChild(iframe);

var doc = iframe.contentWindow.document;//获取iframe中的window要用contentWindow属性。

doc.open();

doc.write(“scriptvar insertJS = function(){};\/scriptbody onload=’insertJS()’/body”);

doc.close();

GMail Mobile：业内JS内容被注释，所以不会执行，在需要的时候，获取script中的text内容去掉注释，调用eval()执行。

script type=”text/javascript”

/*

var …

*/

/script

HTML5新属性：async和defer属性

defer属性：IE4.0就出现。defer属声明脚本中将不会有document.write和dom修改。浏览器会并行下载其他有defer属性的script。而不会阻塞页面后续处理。注：所有的defer脚本必须保证按顺序执行的。

script type=”text/javascript” defer/script

async属性：HTML5新属性。脚本将在下载后尽快执行，作用同defer，但是不能保证脚本按顺序执行。他们将在onload事件之前完成。

script type=”text/javascript” defer/script

Firefox 3.6、Opera 10.5、IE 9和最新的Chrome和Safari都支持async属性。可以同时使用async和defer，这样IE 4之后的所有IE都支持异步加载。

没有async属性，script将立即获取（下载）并执行，期间阻塞了浏览器的后续处理。如果有async属性，那么script将被异步下载并执行，同时浏览器继续后续的处理。

总结： 对于支持HTML5的浏览器，实现JS的异步加载只需要在script元素中加上async属性，为了兼容老版本的IE还需加上defer属性；对于不支持HTML5的浏览器(IE可以用defer实现)，可以采用以上几种方法实现。原理基本上都是向DOM中写入script或者通过eval函数执行JS代码，你可以把它放在匿名函数中执行，也可以在onload中执行，也可以通过XHR注入实现，也可以创建一个iframe元素，然后在iframe中执行插入JS代码。

php 异步上传图片几种方法总结

代码如下

form action=”upload.php” id=”form1″ name=”form1″ enctype=”multipart/form-data” method=”post” target=”uploadIframe” !–上传图片页面 — /form iframe name=”uploadIframe” id=”uploadIframe” style=”display:none”/iframe

然后后台处理完上传图片逻辑后返回给前台，利用ajax修改当前页面DOM对象实现无刷新上传图片的友好功能。

实例

代码如下

a.html form enctype=”multipart/form-data” action=”a.php” target=”ifram_sign” method=”POST” input name=”submit” id=”submit” value=”” type=”hidden” label上传文件: input name=”test_file” type=”file” id=”test_file” size=”48″/label input type=”image” value=”立即上传” id=”submit_btn” /formiframe name=”ifram_sign” src=”” frameborder=”0″ height=”0″ width=”0″ marginheight=”0″ marginwidth=”0″/iframe

php代码：

代码如下

?php

if ($_files[“test_file”][“error”] 0)

{

echo “Error: ” . $_files[“test_file”][“error”] . “br /”;

}

else

{

//这里的判断图片属性的方法就不写了。自己扩展一下。

$filetype=strrchr($_files[“test_file”][“name”],”.”);

$filetype=substr($filetype,1,strlen($filetype));

$filename=”img/”.time(“YmdHis”).”.”.$filetype;

move_uploaded_file($_files[“test_file”][“tmp_name”],$filename);

echo ‘script alert(1)/script’;

$return=”parent.document.getElementByIdx_x(‘mpic”.$pageset_id.”‘).innerhtml='”.$dataimgpath.”‘”;

echo “script alert(‘上传成功’)/script”;

echo “script{$return}/script”;

}

?

其实jquery ajax图片异步上传

html:

!DOCTYPE html PUBLIC “-//W3C//dtd Xhtml 1.0 transitional//EN”

“”

html xmlns=”” lang=”en_US” xml:lang=”en_US”

head

title图片异步上传/title

/head

script type=”text/javascript” src=”js/jquery.js”/script

script type=”text/javascript” src=”js/index.js”/script

link type=”text/css” rel=”stylesheet” href=”css/index.css”

body

div class=”frm”

form name=”uploadFrom” id=”uploadFrom” action=”upload.php” method=”post” target=”tarframe” enctype=”multipart/form-data”

input type=”file” id=”upload_file” name=”upfile”

/form

iframe src=”” width=”0″ height=”0″ style=”display:none;” name=”tarframe”/iframe

/div

div id=”msg”

/div

/body

/html

index.js

$(function(){

$(“#upload_file”).change(function(){

$(“#uploadFrom”).submit();

});

});

function stopSend(str){

var im=”img src=’upload/images/”+str+”‘”;

$(“#msg”).append(im);

}

upload.php

?php

$file=$_files[‘upfile’];

$name=rand(0,500000).dechex(rand(0,10000)).”.jpg”;

move_uploaded_file($file[‘tmp_name’],”upload/images/”.$name);

//调用iframe父窗口的js 函数

echo “scriptparent.stopSend(‘$name’)/script”;

?

异步上传图片几种方法

thinkphp 怎么异步加载

// 下面这行代码就是获得的属性

var id=$(this).attr(“id”);

var status=$(this).attr(“rel”);

if(status==0)

{

$.ajax({

url: “{:U(‘Test/operate1’)}”, //请求的url地址

dataType: “json”, //返回格式为json

async: true, //请求是否异步，默认为异步，这也是ajax重要特性

data: { “id”:id, “status”:status}, //参数值

type: “POST”, //请求方式

success: function(result) {$(“#”+id).text(“success”);}, //请求成功时处理

error: function() {$(“#”+id).text(“fail”);} //请求出错处理

});

}

else

{

$.ajax({

url: “{:U(‘Test/operate2’)}”, //请求的url地址

dataType: “json”, //返回格式为json

async: true, //请求是否异步，默认为异步，这也是ajax重要特性

data: { “id”:id, “status”:status}, //参数值

type: “POST”, //请求方式

success: function(result) {$(“#”+id).text(“success”);}, //请求成功时处理

error: function() {$(“#”+id).text(“fail”);} //请求出错处理

});

}

});

/script

相应的函数operate1与operate2的处理如下：

对传到的值进行相应的操作，返回值的操作为：$this-ajaxReturn($result,’JSON’);

2.js异步加载中，rev={$vo[‘phone’]}###{$vo[‘name’]};用来传多个值，在另一个界面中通过explode来分隔数组，分别获得单个的值。

3.异步加载中不能出现echo等输出语句。

script 传数据到 php

要使用两个文件,一个是PHP文件,一个是写有js的HTML文件

JS:

location.href=’a.php?a=’+a;

PHP:

$a = $_GET[‘a’];

如果想在同一个页面完成可以使用iframe实现.

当然ajax也是一种解决方案