您的位置：首页 > 编程技术 > php  >  PHP Session和Javascript实现文件上传进度条

PHP Session和Javascript实现文件上传进度条

 更新时间：2016年11月25日 15:46  点击：1536
本文章来给各位同学介绍关于PHP Session和Javascript实现文件上传进度条实现代码，有需要了解的同学可参考。

在PHP 5.4以前，实现这样的进度条并不容易，主要有三种方法:

1.使用Flash, Java, ActiveX
2.使用PHP的APC扩展
3.使用HTML5的File API
第一种方法依赖第三方的浏览器插件，通用性不足，且易带来安全隐患。不过由于Flash的使用比较广泛，因此还是有很多网站使用Flash作为解决方案。

第二种方法的不足在于，它需要安装PHP的APC扩展库，要求用户能够控制服务器端的配置。另外，如果安装APC仅仅是为了实现一个上传进度条，那么显然有点杀鸡用牛刀的意思。

第三种方法应该是最为理想的方法，不需要服务器端的支持，仅在浏览器端使用Javascript即可。但是由于HTML5标准尚未确立，各浏览器厂商的支持也不相同，所以暂时这种方法还难以普及。

PHP 5.4中引入的基于session的上传进度监视功能(session.upload_progress)，它提供了一个服务器端的上传进度监视解决方案。升级到PHP 5.4之后，可以不必安装APC扩展，仅使用原生PHP和前端的Javascript即可实现上传进度条。

下面我们就详细介绍一下 PHP 5.4 的这个 session.upload_progress 新特性。

原理介绍
当浏览器向服务器端上传一个文件时，PHP将会把此次文件上传的详细信息(如上传时间、上传进度等)存储在session当中。然后，随着上传的进行，周期性的更新session中的信息。这样，浏览器端就可以使用Ajax周期性的请求一个服务器端脚本，由该脚本返回session中的进度信息；浏览器端的Javascript即可根据这些信息显示/更新进度条了。

那么，文件上传信息具体是如何存储的？我们要如何访问它呢？下面我们来详细说明。

PHP 5.4 中引入了一些配置项(在php.ini中进行设置)

 代码如下 复制代码

session.upload_progress.enabled = "1"
session.upload_progress.cleanup = "1"
session.upload_progress.prefix = "upload_progress_"
session.upload_progress.name = "PHP_SESSION_UPLOAD_PROGRESS"
session.upload_progress.freq = "1%"
session.upload_progress.min_freq = "1"

其中enabled控制upload_progress功能的开启与否，默认开启；cleanup 则设置当文件上传的请求提交完成后，是否清除session的相关信息，默认开启。

prefix 和 name 两项用来设置进度信息在session中存储的变量名/键名。关于这两项的详细使用见下文。

freq 和 min_freq 两项用来设置服务器端对进度信息的更新频率。合理的设置这两项可以减轻服务器的负担。

在上传文件的表单中，需要为该次上传设置一个标识符，并在接下来的过程中使用该标识符来引用进度信息。具体的，在上传表单中需要有一个隐藏的input，它的name属性为php.ini中 session.upload_progress.name 的值；它的值为一个由你自己定义的标识符。如下：

 代码如下 复制代码
<input type="hidden"
    name="<?php echo ini_get('session.upload_progress.name'); ?>"
    value="test" />

接到文件上传的表单后，PHP会在$_SESSION变量中新建键，键名是一个将session.upload_progress.prefix的值与上面你自定义的标识符连接后得到的字符串，可以这样得到：

 代码如下 复制代码

$name = ini_get('session.upload_progress.name');
$key = ini_get('session.upload_progress.prefix') . $_POST[$name];

$_SESSION[$key]; // 这里就是此次文件上传的进度信息了
$_SESSION[$key]这个变量的结构是这样的：

 代码如下 复制代码

<?php
$_SESSION["upload_progress_test"] = array(
 "start_time" => 1234567890,   // 开始时间
 "content_length" => 57343257, // POST请求的总数据长度
 "bytes_processed" => 453489,  // 已收到的数据长度
 "done" => false,              // 请求是否完成 true表示完成，false未完成
 
 // 单个文件的信息
 "files" => array(
  0 => array( ... ),
  // 同一请求中可包含多个文件
  1 => array( ... ),
 )
);
?>

这样，我们就可以使用其中的 content_length 和 bytes_processed 两项来得到进度百分比。

原理介绍完了，下面我们来完整的实现一个基于PHP和Javascript的文件上传进度条。

上传表单
首先，来编写我们的上传表单页面 index.php，代码如下：

 代码如下 复制代码

<form id="upload-form"
    action="upload.php" method="POST" enctype="multipart/form-data"
    style="margin:15px 0" target="hidden_iframe">
 
        <input type="hidden" name="<?php echo ini_get("session.upload_progress.name"); ?>" value="test" />
        <p><input type="file" name="file1" /></p>
        <p><input type="submit" value="Upload" /></p>
</form>    
 
<iframe id="hidden_iframe" name="hidden_iframe" src="about:blank" style="display:none;"></iframe>
 
<div id="progress" class="progress" style="margin-bottom:15px;display:none;">
        <div class="bar" style="width:0%;"></div>
        <div class="label">0%</div>
</div>


注意表单中的session.upload_progress.name隐藏项，值设置为了test。表单中仅有一个文件上传input，如果需要，你可以添加多个。

这里需要特别注意一下表单的target属性，这里设置指向了一个当前页面中的iframe。这一点很关键，通过设置target属性，让表单提交后的页面显示在iframe中，从而避免当前的页面跳转。因为我们还得在当前页面显示进度条呢。

#progress 这个div是用来显示进度条的。

注意 别忘了在index.php的最开始加上session_start()。

处理上传的文件
表单的action指向upload.php，我们在upload.php中处理上传的文件，将它转存到当前目录。这里与通常情况下的上传处理没有区别。

 代码如下 复制代码

<?php
if(is_uploaded_file($_FILES['file1']['tmp_name'])){
        move_uploaded_file($_FILES['file1']['tmp_name'], "./{$_FILES['file1']['name']}");
}
?>

Ajax获取进度信息
这一步是关键，我们需要建立一个 progress.php 文件，用来读取session中的进度信息; 然后我们在 index.php 中增加Javascript代码，向 progress.php 发起Ajax请求，然后根据获得的进度信息更新进度条。

progress.php 的代码如下：

 代码如下 复制代码

<?php
session_start();
 
$i = ini_get('session.upload_progress.name');
 
$key = ini_get("session.upload_progress.prefix") . $_GET[$i];
 
if (!empty($_SESSION[$key])) {
        $current = $_SESSION[$key]["bytes_processed"];
        $total = $_SESSION[$key]["content_length"];
        echo $current < $total ? ceil($current / $total * 100) : 100;
}else{
        echo 100;
}
?>

在这里我们获得$_SESSION变量中的进度信息，然后输出一个进度百分比。

在 index.php 中，我们将如下代码添加到页面底部 (为简便，这里使用jQuery):

 代码如下 复制代码
function fetch_progress(){
        $.get('progress.php',{ '<?php echo ini_get("session.upload_progress.name"); ?>' : 'test'}, function(data){
                var progress = parseInt(data);
 
                $('#progress .label').html(progress + '%');
                $('#progress .bar').css('width', progress + '%');
 
                if(progress < 100){
                        setTimeout('fetch_progress()', 100);
                }else{
            $('#progress .label').html('完成!');
        }
        }, 'html');
}
 
$('#upload-form').submit(function(){
        $('#progress').show();
        setTimeout('fetch_progress()', 100);
});

当#upload-form被提交时，我们把进度条显示出来，然后反复调用 fetch_progress() 获得进度信息，并更新进度条，直到文件上传完毕，显示'完成!'


注意事项


input标签的位置
name为session.upload_progress.name的input标签一定要放在文件input <input type="file" /> 的前面。

取消上传
通过设置 $_SESSION[$key]['cancel_upload'] = true 可取消当次上传。但仅能取消正在上传的文件和尚未开始的文件。已经上传成功的文件不会被删除。

setTimeout vs. setInterval
应该通过 setTimeout() 来调用 fetch_progress()，这样可以确保一次请求返回之后才开始下一次请求。如果使用 setInterval() 则不能保证这一点，有可能导致进度条出现’不进反退’。

本文章给大家介绍PHP中多字节字符的preg_match_all实例，大家可参考。
 代码如下 复制代码

function mb_ereg_match_all($pattern, $subject, array &$subpatterns)
{
if(!mb_ereg_search_init($subject, $pattern)) // 初期化?I理
return false;
$subpatterns = array();
while($r = mb_ereg_search_regs()) { // 初期化?I理で?定したパタ?ンと文字列から?仕?br /> $subpatterns[] = $r;
}
return true;
}

$pattern = ‘[^s　]+’;
$subject = ‘你好， 吃了么。 我吃 的包子加油条。’;
mb_ereg_match_all($pattern, $subject, $result);
print_r($result);
json数据是我们实时交互时一些常用的文件，他可以利用php动态生成并由js或php接受进行相关处理，下面我来给各位同学介绍JSON数据的创建和解析,有需要了解的同学可参考。

具体操作

JSON是什么？

JSON一种用于在互联网络中传输超量数据的数据交换格式。虽然在Internet中交换数据XML占主要地位，然而JSON却更加的简单并且适用于轻型的数据。

尽管JSON当初是被JavaScript发明并且用于访问远程数据的，它现在却被广泛适用于各种语言，因为JSON是一种于平台无关的数据格式。

JSON数据的数据类型和实例

JSON支持各种各样的数据类型，包括数字、字符串、布尔值、数组数据甚至对象数据（是一个集合，每个元素都是键：值对形式，使用逗号分隔，并且使用大括号包裹）。

让我们看一个JSON数据的简单例子，该例子表示一个雇员的详细信息：

 代码如下 复制代码

{“id”:”1″,”name”:”mike”,”country”:”usa”,”office”:["microsoft","oracle"]}

使用PHP创建和解析JSON数据的方法

PHP从5.2.0版本以后提供了JSON扩展来处理JSON数据，通过PHP有两个函数json_encode()和json_decode非常方便的对JSON数据进行转换和解析。

首先，让我们看一段PHP用数组创建如上各式的JSON的代码：

 代码如下 复制代码

$json_data = array ('id'=>1,'name'=>"mike",'country'=>'usa',"office"=>array("microsoft","oracle"));  echo json_encode($json_data);


该代码直接产生了JSON数据。现在让我们用PHP将上面的JSON解码：

 代码如下 复制代码

$json_string='{"id":1,"name":"mike","country":"usa","office":["microsoft","oracle"]} ';  $obj=json_decode($json_string);

现在变量$obj包含了使用PHP解析后的JSON数据，你可以使用以下的方法来输出和访问：

 代码如下 复制代码

echo $obj->name; //displays mike  echo $obj->office[0]; //displays microsoft


你猜的没错$obj->office是一个数组，你能够使用PHP的foreach方法遍历它：

 代码如下 复制代码

foreach($obj->office as $val)      echo $val;

ajax时返回JSON格式的数据


原来的数据就是JSON格式
下例来自《锋利的jQuery

 代码如下 复制代码


$(function(){
     $('#send').click(function() {
          $.getJSON('test.js', function(data) {
              $('#resText').empty();
   var html = '';
   $.each( data  , function(commentIndex, comment) {
    html += '<div class="comment"><h6>' + comment['username'] + ':</h6><p class="para">' + comment['content'] + '</p></div>';
   })
  $('#resText').html(html);
         })
    })
})

你需要做的就是将数据存储为格式正确的 .json或者.js 文件。以下为示例所传送的json格式的数据


[
  {
    "username": "张三",
    "content": "沙发."
  },
  {
    "username": "李四",
    "content": "板凳."
  },
  {
    "username": "王五",
    "content": "地板."
  }
]

php输出JSON格式

那么php如何输出json格式？php 使用json_encode函数，然后jQuery使用datatype:json 就可以了嘛? 它的输出如下：

显然并非所愿。还是字符串，到底怎么实现？其实很简单，只要在php文件头部加入以下代码:

 代码如下 复制代码


header('Content-type: text/json');

这个头就是告知此文件输出类型为 json，这种形式我们见的最多的是验证码——php输出验证图片，有时php可以输出css文件，js文件等做一些有趣的事情。好的，我们测试一下吧

 代码如下 复制代码

<?php
header('Content-type: text/json');

$fruits = array (
    "fruits"  => array("a" => "orange", "b" => "banana", "c" => "apple"),
    "numbers" => array(1, 2, 3, 4, 5, 6),
    "holes"   => array("first", 5 => "second", "third")
);
echo json_encode($fruits);
?>
这是一个朋友在新浪面试之后把所有面试题与答案都拿出来了，下面我把东西记录一下，有用得上的兄弟们可先看一次，对过去面试有个底。

1. 写一个函数，尽可能高效的，从一个标准 url 里取出文件的扩展名
  例如: /abc/de/fg.php?id=1 需要取出 php 或 .php

答：我是直接用PHP内置函数搞定的，不重复造轮子，估计出题者也是想考察基础知识，主要是解析url和一个返回文件信息的函数（扩展：取得文件后缀名的多种方法）：

 代码如下 复制代码

<?php
    /** by  */
    $url = "/abc/de/fg.php?id=1";
    $path = parse_url($url);
    echo pathinfo($path['path'],PATHINFO_EXTENSION);  //php
?>


2. 在 HTML 语言中，页面头部的 meta 标记可以用来输出文件的编码格式，以下是一个标准的 meta 语句
  <META http-equiv='Content-Type' content='text/html; charset=gbk'>
  请使用 PHP 语言写一个函数，把一个标准 HTML 页面中的类似 meta 标记中的 charset 部分值改为 big5
  请注意:
  (1) 需要处理完整的 html 页面，即不光此 meta 语句
  (2) 忽略大小写
  (3) ' 和 " 在此处是可以互换的
  (4) 'Content-Type' 两侧的引号是可以忽略的，但 'text/html; charset=gbk' 两侧的不行
  (5) 注意处理多余空格

答：表示我正则表达式（PHP正则详解）忘记差不多了，弄了半天。

 代码如下 复制代码

<?php
    /**  */
    $html = "<meta http-equiv='Content-Type' content='text/html; charset=gbk'>";
    //匹配标准的meta标签
    $pattern = "/<metas+http-equiv=('|")?Content-Type('|")?s+content=('|")text/html;s+charset=(.*)('|")>/i";
    $replacement = "<meta http-equiv='Content-Type' content='text/html; charset=big5'>";
    $result = preg_replace($pattern, $replacement, $html);
    echo htmlspecialchars($result);
?>

3. 写一个函数，算出两个文件的相对路径
  如 $a = '/a/b/c/d/e.php';
  $b = '/a/b/12/34/c.php';
  计算出 $b 相对于 $a 的相对路径应该是 ../../c/d将()添上

答案：

 代码如下 复制代码

<?php
    /** by  */
    $a = '/a/b/c/d/e.php';
    $b = '/a/b/13/34/c.php';
    echo getRelativePath($a, $b); //"../../12/34/"
    function getRelativePath($a,$b){
        $a2array = explode('/', $a);
        $b2array = explode('/', $b);
        $relativePath   = '';
        for( $i = 1; $i <= count($b2array)-2; $i++ ) {
            $relativePath .= $a2array[$i] == $b2array[$i] ? '../' : $b2array[$i].'/';
        }
        return $relativePath;
    }
?>


4.写一个函数，能够遍历一个文件夹下的所有文件和子文件夹。

答：这个我之前就在博客中写过（PHP文件遍历及文件拷贝），只是实现的方法很多，效率不一定最高

 代码如下 复制代码


/*
 *@blog 
 */
function listDir($dir = '.'){
 if ($handle = opendir($dir)) {
  while (false !== ($file = readdir($handle))) {
   if($file == '.' || $file == '..'){
    continue;
   }
   if(is_dir($sub_dir = realpath($dir.'/'.$file))){
    echo 'FILE in PATH:'.$dir.':'.$file.'<br>';
    listDir($sub_dir);
   }else{
    echo 'FILE:'.$file.'<br>';
   }
  }
  closedir($handle);
 }
}
 
listDir('e:wwwabc');


5.简述论坛中无限分类的实现原理。

答：无限极分类，那么应该是考察递归函数吧！

第一步：建立测试数据库：

 代码如下 复制代码

 CREATE TABLE `category` (
  `id` smallint(5) unsigned NOT NULL auto_increment,
  `fid` smallint(5) unsigned NOT NULL default '0',
  `value` varchar(50) NOT NULL default '',
  PRIMARY KEY (`id`)
 ) ENGINE=MyISAM DEFAULT CHARSET=utf8;


第二步：插入测试数据：

 代码如下 复制代码

 INSERT INTO `category` ( `fid`, `value`) VALUES
 (0, 'PHP点点通博客Pxx.COM'),
 (1,'a'),
 (1,'b'),
 (2,'c'),
 (2,'d'),
 (4,'e')


第三步：递归输出分类：

 代码如下 复制代码


<?php
/** by  */
$conn = mysql_connect("localhost", "root", "mckee");
mysql_select_db("test",$conn);
mysql_query("set names utf8");
$sql = "SELECT * FROM category";
$res = mysql_query($sql);
while($row = mysql_fetch_assoc($res)){
    $arr[] = array($row[id],$row[fid],$row[value]);
}
getCate(0);
function getCate($fid = 0) {  
    global $arr;
    for ($i = 0; $i < count($arr); $i++) {  
        if ($arr[$i][1] == $fid) {       
            echo $arr[$i][2] . "<br>";
            getCate($arr[$i][0]); //递归
        }
    }
}
?>

6.设计一个网页，使得打开它时弹出一个全屏的窗口，该窗口中有一个文本框和一个按钮。用户在文本框中输入信息后点击按钮就可以把窗口关闭，而输入的信息却在主网页中显示！

 答案：尼玛。都没明白出这题目是干嘛的，新浪工程师脑子进水了吗？考察js的window对象？亲们告诉我？

index.html

 代码如下 复制代码

<html>
    <head>
        <title>by </title>
    </head>
 <body>
  <h1></h1>
  <script type="text/javascript">
   open('fullwin.html');
  </script>
 </body>
</html>


fullwin.html

 代码如下 复制代码


<html>
     <head>
        <title>by </title>
     </head>
 <body>
  <script type="text/javascript">
   window.moveTo(0, 0);
   window.resizeTo(window.screen.width, window.screen.height);
   var s = prompt('请输入：');
   window.opener.document.getElementsByTagName('h1')[0].innerText = s;
   window.close();
  </script>
 </body>
</html>


unset引用

 代码如下 复制代码

<?php
    $a = "this is a php blog";
    $b = & $a;
    unset($b);
    echo $a; //this is a php blog
?>

这个我很清楚，unset($b),只是断开了变量名和值得绑定，但是神奇的是：

 

 代码如下 复制代码
<?php
    $a = "test";
    $b = & $a;
    unset($a);
    echo $b;//test
?>

但是我销毁$a了，为嘛$b的值还在呢？晕了，求解!

感谢下面网友回复，让我明白了：

关于unset()函数使用注意:只有当指向该值的所有变量（比如有引用变量指向该值）都被销毁后，地址才会被释放,如下：

 

 代码如下 复制代码
<?php
    /** by www.111cn.net */
    $a = "test";
    $b = & $a;
    unset($a);
    unset($b);
    echo $b;//输出空
?>
在网站开发中跨域是一个头痛的事情，我经常要需要解决各种跨域问题，今天我来介绍在php中利用JSONP跨域实现方法，各位J友可参考参考。


先看一个实例

 代码如下 复制代码


$("#btn").click(function(k) {
    //...
    var j = form.serializeArray();//序列化name/value
    $.ajax({
        url: "另一个域名/test.php",
        dataType: 'jsonp',
        data: j,
        jsonp: 'jsonp_callback',
        success: function(json) { //返回的json数据
           json = json || {};
            if (json.msg=='err'){
                alert(json.info);
            }else if (json.msg=="ok"){
                alert('提交成功');
            }else{
                alert('提交失败');
            }
        },
        timeout: 3000
    })
    //...
});


php部分:

 代码如下 复制代码
$jsonp_callback=$_GET['jsonp_callback'];
//...
//如果正确
echo $jsonp_callback,'({"msg":"ok"})';
5.//如果错误
echo $jsonp_callback,'({"msg":"err","info":"因人品问题，发送失败"})';

//...值得注意的是采用jsonp 方式,beforeSend / error 都不能用了，所以beforeSend里面用js实现的验证只能用ajax在服务器端test.php上面验证了。

域名下面有这么个html文件testjsonp.html：

代码如下:

 代码如下 复制代码

<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN“ “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd“>
 <html xmlns=“http://www.w3.org/1999/xhtml“ >
 <head>
     <title>Untitled Page</title>
      <script type=“text/javascript“ src=“jquery-1.7.2.min.js“></script>
      <script type=“text/javascript“>
     jQuery(document).ready(function(){
        $.ajax({
             type: “GET“,
             async: false,
             //url: “http://test/jsonp.php“,
             url:“http://mytaobao.com/jsonp.php“,
             dataType: “jsonp“,
             jsonp: “callback“,//传递给请求处理程序或页面的，用以获得jsonp回调函数名的参数名(一般默认为:callback)
             jsonpCallback:“flightHandler“,//自定义的jsonp回调函数名称，默认为jQuery自动生成的随机函数名，也可以写“?“，jQuery会自动为你处理数据
             success: function(json){
                 alert('您查询到航班信息：票价： ' + json.price + ' 元，余票： ' + json.tickets + ' 张。回调函数名为: '+json.func);
             },
             error: function(){
                 alert(“fail“);
             }
         });
     });
     </script>
     </head>
  <body>
  </body>
 </html>

注意，要真正运行上面的代码可能需要jquery的文件，你可以将

 代码如下 复制代码
<script type=“text/javascript“ src=“jquery-1.7.2.min.js“></script>

改为你目录中jquery的文件路径：
如：

 代码如下 复制代码
<script type=“text/javascript“ src=“js/jquery.js“></script>

然后，你可以再找个另外一个域名的web目录，将文件jsonp.php:

代码如下:

 代码如下 复制代码
<?php
$callback = $_GET[“callback“];
$a = array(
 'code'=>'CA1998',
    'price'=>'6000',
    'tickets'=>20,
    'func'=>$callback,
);
$result = json_encode($a);
echo “flightHandler($result)“;
exit;

放到这个目录下面去。这样就可以测试了。
直接在浏览器访问testjsonp.html.就可以看到效果了

[!--infotagslink--]

相关文章

  • 使用PHP+JavaScript将HTML页面转换为图片的实例分享

    这篇文章主要介绍了使用PHP+JavaScript将HTML元素转换为图片的实例分享,文后结果的截图只能体现出替换的字体,也不能说将静态页面转为图片可以加快加载,只是这种做法比较interesting XD需要的朋友可以参考下...2016-04-19

  • 关于JavaScript中name的意义冲突示例介绍

    在昨天的《Javascript权威指南》学习笔记之十：ECMAScript 5 增强的对象模型一文中，对于一段代码的调试出现了一个奇怪现象，现将源代码贴在下面： 复制代码 代码如下: <script type="text/javascript"> function Person(){}...2014-05-31

  • C#和JavaScript实现交互的方法

    最近做一个小项目不可避免的需要前端脚本与后台进行交互。由于是在asp.net中实现，故问题演化成asp.net中jiavascript与后台c#如何进行交互。...2020-06-25

  • javascript自定义的addClass()方法

    复制代码 代码如下: //element:需要添加新样式的元素，value：新的样式 function addClass(element, value ){ if (!element.className){ element.className = value; }else { newClassName = element.className; newClas...2014-05-31

  • JavaScript中的this关键字使用方法总结

    在javascritp中，不一定只有对象方法的上下文中才有this， 全局函数调用和其他的几种不同的上下文中也有this指代。 它可以是全局对象、当前对象或者任意对象，这完全取决于函数的调用方式。JavaScript 中函数的调用有以下...2015-03-15

  • 详解javascript数组去重问题

    首先，我想到的是另建一个结果数组，用来存储原始数组中不重复的数据。遍历原始数组依次跟结果数组中的元素进行比较，检测是否重复。于是乎，我写出了如下代码A： Array.prototype.clearRepetitionA = function(){ var resul...2015-11-08

  • JavaScript中逗号运算符介绍及使用示例

    有一道js面试题，题目是这样的：下列代码的执行结果是什么，为什么？ 复制代码 代码如下: var i, j, k; for (i=0, j=0; i<10, j<6; i++, j++) { k = i+j; } document.write(k); 答案是显示10，这道题主要考察JavaScript的逗...2015-03-15

  • javascript的事件触发器介绍的实现

    事件触发器从字面意思上可以很好的理解，就是用来触发事件的，但是有些没有用过的朋友可能就会迷惑了，事件不是通常都由用户在页面上的实际操作来触发的吗？这个观点不完全正确，因为有些事件必须由程序来实现，如自定义事件，jQue...2014-06-07

  • Javascript类型转换的规则实例解析

    这篇文章主要介绍了Javascript类型转换的规则实例解析，涉及到javascript类型转换相关知识，对本文感兴趣的朋友一起学习吧...2016-02-27

  • ActiveX控件与Javascript之间的交互示例

    1、ActiveX向Javascript传参 复制代码 代码如下: <script language="javascript" for="objectname" event="fun1(arg)"> fun2(arg); </script> objectname为ActiveX控件名，通过<object>标签里的id属性设定,如下； 复制...2014-06-07

  • 详解JavaScript操作HTML DOM的基本方式

    通过 HTML DOM，可访问 JavaScript HTML 文档的所有元素。 HTML DOM (文档对象模型) 当网页被加载时，浏览器会创建页面的文档对象模型（Document Object Model）。 HTML DOM 模型被构造为对象的树： 通过可编程的对象模型，Java...2015-10-23

  • JavaScript获取浏览器信息的方法

    Window有navigator对象让我们得知浏览器的全部信息.我们可以利用一系列的API函数得知浏览器的信息.JavaScript代码如下:function message(){ txt = "<p>浏览器代码名: " + navigator.appCodeName + "</p>";txt+= "<p>...2015-11-24

  • 跟我学习javascript的最新标准ES6

    虽然ES6都还没真正发布，但已经有用ES6重写的程序了，各种关于ES789的提议已经开始了，这你敢信。潮流不是我等大众所能追赶的。潮流虽然太快，但我们不停下学习的步伐，就不会被潮流丢下的，下面来领略下ES6中新特性，一堵新生代JS...2015-11-24

  • javascript设计模式之解释器模式详解

    神马是“解释器模式”？先翻开《GOF》看看Definition：给定一个语言，定义它的文法的一种表示，并定义一个解释器，这个解释器使用该表示来解释语言中的句子。在开篇之前还是要科普几个概念： 抽象语法树： 解释器模式并未解释如...2014-06-07

  • Php文件上传类class.upload.php用法示例

    本文章来人大家介绍一个php文件上传类的使用方法，期望此实例对各位php入门者会有不小帮助哦。 简介 Class.upload.php是用于管理上传文件的php文件上传类， 它可以帮...2016-11-25

  • JavaScript预解析,对象详解

    这篇文章主要介绍了JavaScript预解析,对象的的相关资料，小编觉得这篇文章写的还不错，需要的朋友可以参考下，希望能够给你带来帮助...2021-11-10

  • 学习JavaScript设计模式之装饰者模式

    这篇文章主要为大家介绍了JavaScript设计模式中的装饰者模式，对JavaScript设计模式感兴趣的小伙伴们可以参考一下...2016-01-21

  • PHP文件上传一些小收获

    又码了一个周末的代码，这次在做一些关于文件上传的东西。（PHP UPLOAD）小有收获项目是一个BT种子列表，用户有权限上传自己的种子，然后配合BT TRACK服务器把种子的信息写出来...2016-11-25

  • JavaScript操作URL的相关内容集锦

    ---恢复内容开始---1.location.href.....（1）self.loction.href="http://www.cnblogs.com/url" window.location.href="http://www.cnblogs.com/url" 以上两个用法相同均为在当前页面打开URL页面 （2）this.locati...2015-10-30

  • javascript实现tab切换的四种方法

    tab切换在网页中很常见，故最近总结了4种实现方法。 首先，写出tab的框架，加上最简单的样式，代码如下： <!DOCTYPE html> <html> <head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><style> *{ pa...2015-11-08