亚洲乱码中文字幕综合,中国熟女仑乱hd,亚洲精品乱拍国产一区二区三区,一本大道卡一卡二卡三乱码全集资源,又粗又黄又硬又爽的免费视频

使用jquery.form.js實現圖片上傳的方法

 更新時間:2016年05月05日 10:31:37   作者:314756557  
這篇文章主要介紹了使用jquery.form.js實現圖片上傳的方法,涉及jquery使用表單插件jquery.form.js進行圖片上傳的提交、類型驗證、執(zhí)行結果回調顯示等技巧,非常簡單實用,需要的朋友可以參考下

本文實例講述了使用jquery.form.js實現圖片上傳的方法。分享給大家供大家參考,具體如下:

testupfile2.php

<?php
header('Content-type:text/html;charset=utf-8');
include_once 'includes/common.inc.php';
 if(!empty($_FILES['upfile'])){
 //文件格式
 $image=array('image/jpg',
   'image/jpeg',
   'image/png',
   'image/pjpeg',
   'image/gif',
   'image/bmp',
   'image/x-png'
 );
$updir=$_SERVER['DOCUMENT_ROOT'].$_config['g']['baseUrl'].'/attached/images/';
$upfile=$_FILES['upfile'];
$name=$upfile['name'];
$ext=substr($upfile['name'],strpos($upfile['name'],'.'));
$upname=md5(time().rand(1, 1000)).$ext;
$type=$upfile['type'];
$size=$upfile['size'];
$tmp_name=$upfile['tmp_name'];
$error=$upfile['error'];
$ok=0;
 foreach ($image as $key=>$value) {
 if($type==$value)$ok=1;
 }
 if($ok=='1' && $error=='0'){
 move_uploaded_file($tmp_name,$updir.$upname);
 //echo '<br>'.$tmp_name.'<br>'.$upname.'<br>'.$updir.'<br>'.$ext.'上傳成功';
 //echo '上傳成功';
 echo $upname;
 //$im=$updir.$upname;
 //echo $im;
 //echo '<img src='.$updir.$upname.' />';
 //$views->assign('image',$upname);
 //$views->display('default/testupfile.html');
 }
 else echo '上傳失敗2';
}
else echo '上傳失敗1';
?>

testupfile.html

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<script type="text/javascript" src="<!--{$baseUrl}-->/scripts/jquery.js"></script>
<script type="text/javascript" src="<!--{$baseUrl}-->/scripts/jquery.form.js"></script>
<script type="text/javascript">
$(function(){
 //jquery.form image1
 $("#upimage").bind("click",function(){
 if($("#upfile").val()==""){
  alert("請選擇一個圖片文件,再點擊");
  return;
 }
 $("#form1").ajaxSubmit({
  url:"testupfile2.php",
  type:"POST",
  //date:"upfile=upfile",
  success:function(response){
  alert(response);
  $("#ln").empty();
  $("#ln").append("<img src='<!--{$baseUrl}-->/attached/images/"+response+"' width='100' height='60'/>");
  $("#im1").val(response);
  },
  error:function(msg){
  alert("出錯了");
  }
 });
 });
 //jquery.form image2
 $("#upimage2").bind("click",function(){
 if($("#upfile2").val()==""){
  alert("請選擇一個圖片文件,再點擊2");
  return;
 }
 $("#form2").ajaxSubmit({
  url:"testupfile2.php",
  type:"POST",
  //date:"upfile=upfile2",
  success:function(response2){
  alert(response2);
  $("#ln2").empty();
  $("#ln2").append("<img src='<!--{$baseUrl}-->/attached/images/"+response2+"' width='100' height='60'/>");
  $("#im2").val(response2);
  },
  error:function(msg){
  alert("出錯了");
  }
 });
 });
});
</script>
</head>
<body>
文件上傳
<form enctype="multipart/form-data" id="form1" method="post" action="">
文件:
 <input type="file" name="upfile" id="upfile"><input type="button" id="upimage" value="圖片上傳1">
 <input type="text" name="im1" id="im1" value="" />
</form>
<form enctype="multipart/form-data" id="form2" method="post" action="">
文件:
 <input type="file" name="upfile" id="upfile2"><input type="button" id="upimage2" value="圖片上傳2">
 <input type="text" name="im2" id="im2" value="" />
</form>
<div id="ln">tu</div><br>
<div id="ln2">tu2</div>
</body>
</html>

更多關于jQuery相關內容感興趣的讀者可查看本站專題:《jQuery form操作技巧匯總》、《jquery中Ajax用法總結》、《jQuery切換特效與技巧總結》、《jQuery拖拽特效與技巧總結》、《jQuery擴展技巧總結》、《jQuery常見經典特效匯總》、《jQuery動畫與特效用法總結》、《jquery選擇器用法總結》及《jQuery常用插件及用法總結

希望本文所述對大家jQuery程序設計有所幫助。

相關文章

  • jQuery UI-Draggable 參數集合

    jQuery UI-Draggable 參數集合

    jQuery UI-Draggable常用參數集合。
    2010-01-01
  • jQuery插件imgAreaSelect基礎講解

    jQuery插件imgAreaSelect基礎講解

    關于ImgAreaSelect, 是一jQuery插件,它支持用戶通過鼠標拖曳選擇圖片的一部分,如圖片拖曳、圖片編輯等。下面通過本文給大家介紹jQuery插件imgAreaSelect基礎講解,需要的的朋友參考下吧
    2017-05-05
  • jQuery源碼分析之Event事件分析

    jQuery源碼分析之Event事件分析

    對于javascript事件擴展,所有的lib都差不多。和jquery和prototype,yui和Ext,其要解決的首要問題是兼容性,所有 lib都會對event進行包裹,統(tǒng)一其屬性解決其兼容性。
    2010-06-06
  • json格式的javascript對象用法分析

    json格式的javascript對象用法分析

    這篇文章主要介紹了json格式的javascript對象用法,結合實例形式總結分析了javascript針對json格式數據操作的常見技巧,需要的朋友可以參考下
    2016-07-07
  • jQuery實現獲取當前鼠標位置并輸出功能示例

    jQuery實現獲取當前鼠標位置并輸出功能示例

    這篇文章主要介紹了jQuery實現獲取當前鼠標位置并輸出功能,涉及jQuery事件響應及頁面元素屬性動態(tài)操作相關實現技巧,需要的朋友可以參考下
    2019-01-01
  • jQuery焦點圖輪播特效代碼分享(3款)

    jQuery焦點圖輪播特效代碼分享(3款)

    這篇文章主要介紹了jQuery焦點圖輪播特效,jQuery cxSlide實現的三款多功能大氣焦點圖輪播特效源碼,是一段擁有三種不同風格和效果的焦點圖輪播代碼,還可以使用鼠標的滾輪控制圖片的縮放,推薦給大家,有需要的小伙伴可以參考下
    2015-09-09
  • jQuery 計算iframe 窗口大小的方法

    jQuery 計算iframe 窗口大小的方法

    這篇文章主要介紹了jQuery如何計算iframe窗口大小,需要的朋友可以參考下
    2014-05-05
  • jQuery.autocomplete 支持中文輸入(firefox)修正方法

    jQuery.autocomplete 支持中文輸入(firefox)修正方法

    jQuery.autocomplete 是jquery的流行插件,,能夠很好的實現輸入框的自動完成(autocomplete)、建議提示(input suggest)功能,支持ajax數據加載。
    2011-03-03
  • jQuery分組選擇器簡單用法示例

    jQuery分組選擇器簡單用法示例

    這篇文章主要介紹了jQuery分組選擇器簡單用法,結合實例形式分析了使用jQuery分組選擇器動態(tài)設置頁面元素屬性相關操作技巧,需要的朋友可以參考下
    2019-04-04
  • 淺談jquery事件處理

    淺談jquery事件處理

    這篇文章主要簡單介紹了jquery事件處理,十分的實用,有需要的小伙伴可以參考下。
    2015-04-04

最新評論