表单提交图片上传
① form表单提交上传图片
上传图片我首先想到的是利用这个插件，webupload LUploade这类插件大多支持图片预览，断点/分片上传，功能比较丰富，但是由于后台原因我需要利用form表单进行上传图片，所以就整理了一下关于图片上传的几种方式：
1.form表单上传图片
表单上传遇到了一下几个问题：
（1）进行表单提交时，无法获取返回值
（2）表单提交会进行页面刷新
为了解决这个问题，我想到了利用iframe进行解决，在form元素上直接添加target属性，使提交跳转页面直接跳转到iframe中，阻止页面进行跳转，返回结果也会呈现在 iframe框架之中，我们可以去除iframe中的返回值，前提是必须在同一个域名下。这样我们获取返回值就会拥有局限性。还好我反降了另外一种方法，jquery中jqueryj.form.js表单提交插件。我们可以直接这样来获取表单返回值。
form表单提交注意事项：
(1).提供form表单，method必须是post。
(2).form表单的enctype必须是multipart/form-data。
javascript学习交流群：4538335s's's's'sssssssssssssss54
enctype 属性规定在发送到服务器之前应该如何对表单数据进行编码。默认地，表单数据会编码为 "application/x-www-form-urlencoded"。就是说，在发送到服务器之前，所有字符都会进行编码。HTML表单如何打包数据文件是由enctype这个属性决定的。enctype有以下几种取值：
application/x-www-form-urlencoded：在发送前编码所有字符(默认)(空格被编码为’+’，特殊字符被编码为ASCII十六进制字符)。
multipart/form-data：不对字符编码。在使用包含文件上传控件的表单时，必须使用该值。
text/plain：空格转换为 “+” 加号，但不对特殊字符编码。
默认enctype=application/x-www-form-urlencoded，所以表单的内容会按URL规则编码，然后根据表单的提交方法：
method=’get’ 编码后的表单内容附加在请求连接后，
method=’post’ 编码后的表单内容作为post请求的正文内容。
(3).提供input type="file"上传输入域。
2.ajax无刷新上传
ajax和FormData可实现页面无刷新的文件上传效果，主要用到了jQuery的ajax()方法和XMLHttpRequest Level 2的
FormData接口。通过FormData对象可以更灵活方便的发送表单数据，因为可以独立于表单使用。如果你把表单的编码类型设置为multipart/form-data ，则通过FormData传输的数据格式和表单通过submit()方法传输的数据格式相同。
ajax无刷新上传
Ajax无刷新上传的方式，本质上与表单上传无异，只是把表单里的内容提出来采用ajax提交，并且由前端决定请求结果回传后的展示结果。
3.各类插件的使用：
webupload LUPloader
② asp.net mvc 里如何提交表单同时上传图片
能说具体点吗？如果你安装的是mvc
1.0的话可以参考，里面有个注册用户，然后在服务器端验证的方法。就是在accountcontroller.cs里
③ html表单怎么上传图片
html表单这样上传图片：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "www.mobiletrain.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="www.mobiletrain.org">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>上传图片</title>
</head>
④ 金山表单怎么上传图片
先把照片“复制”，然后在WPS表格中点击下拉菜单的“开始”、“粘贴”，照片就会出现在表格中。金山表单是哦金山文档旗下专业的信息收集工具-金山表单,原wps表单,免费创建问卷调查、信息统计、考试测评、投票、接龙等应用,覆盖多种题型、支持定位、文件收集、图片收集等功能。
⑤ 苹果13p金山表单怎么上传图片
1、点击“插入”选项，选择图片。
2、点击想要上传图片的位置，再在文件中选择想要插入的图片，确认即可。
⑥ 用表单上传图片应怎么做啊用php
<?php
set_time_limit(0);
define('ROOT',dirname(__FILE__).'/');
if($_POST['submit']){
foreach ($_FILES['upfile']['tmp_name'] as $k=>$v){
!$v || (!file_exists(ROOT.'/upload/'.$_FILES['upfile']['name'][$k]) && @getimagesize($v) && @move_uploaded_file($v,ROOT.'/upload/'.$_FILES['upfile']['name'][$k]) && print ('上传'.$_FILES['upfile']['name'][$k].'成功<br /><img src="'.$site['url'].'upload/upload/'.$_FILES['upfile']['name'][$k].'" />') )|| print ('上传'.$_FILES['upfile']['name'][$k].'失败<br />');
}
}
?>
<html>
<head>
<title>上传</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<style type="text/css">body,td{font-family:tahoma,verdana,arial;font-size:11px;line-height:15px;background-color:white;color:#666666;margin-left:20px;}
strong{font-size:12px;}
a:link{color:#0066CC;}
a:hover{color:#FF6600;}
a:visited{color:#003366;}
a:active{color:#9DCC00;}
table.itable{}
td.irows{height:20px;background:url("index.php?i=dots") repeat-x bottom}</style>
<script language="JavaScript">
function adpload() {
document.all.upload.innerHTML = '<input name="upfile[]" type="file" style="width:200;border:1 solid #9a9999; font-size:9pt; background-color:#ffffff" size="25"><br /><input name="upfile[]" type="file" style="width:200;border:1 solid #9a9999; font-size:9pt; background-color:#ffffff" size="25"><br />'+document.all.upload.innerHTML;
}
</script>
</head>
<body>
<center><form enctype="multipart/form-data" method="post" name="upform">
上传图片:按上传按纽，上传成功后可以直接粘贴图片于编辑器中 <br><br>
<a href='#' onClick="adpload()">增加上传文件</a><br><br>
<input name="upfile[]" type="file" style="width:200;border:1 solid #9a9999; font-size:9pt; background-color:#ffffff" size="25"><br>
<input name="upfile[]" type="file" style="width:200;border:1 solid #9a9999; font-size:9pt; background-color:#ffffff" size="25"><br>
<div id="upload"></div>
<input type="submit" name="submit" value="上传" style="width:30;border:1 solid #9a9999; font-size:9pt; background-color:#ffffff" size="25"><br><br><br>
<br><br>
<a href="index.php">返回</a><br />
</form>
</center>
</body>
</html>
⑦ web前端上传图片的几种方法
下面给你介绍3种web前端上传图片的方法：
1.表单上传
最传统的图片上传方式是form表单上传，使用form表单的input[type=”file”]控件，打开系统的文件选择对话框，从而达到选择文件并上传的目的。
ajax无刷新上传
Ajax无刷新上传的方式，本质上与表单上传无异，只是把表单里的内容提出来采用ajax提交，并且由前端决定请求结果回传后的展示结果。
3.各类插件上传
当上传的需求要求可预览、显示上传进度、中断上传过程、大文件分片上传等等，这时传统的表单上传很难实现这些功能，我们可以借助现有插件完成。
如网络上传插件Web Uploader、jQuery图片预览插件imgPreview 、拖拽上传与图像预览插件Dropzone.js等等，大家可根据项目实际需求选择适合的插件。
⑧ html 表单上传图片
使用表单中的文件域（<input type="file".../>）控件可以上传文件。
打开DreamWeaver，这里使用的版本是CS6，新建一个php文件。
保存到网站目录下，命名为upload.php。
在代码中插入一个表单
对话框中，操作留空，方法选择“post”，编码类型输入“multipart/form-data”，名称命名为“upload_form”，其中编码类型必须为“multipart/form-data”。点击确定，产生的代码如下：
<body>
<form action="" method="post" enctype="multipart/form-data" name="upload_form"></form>
</body>
接下来在form中插入一个标签控件、一个文件域控件和一个上传按钮。
结果如下：
<body>
<form action="" method="post" enctype="multipart/form-data" name="upload_form">
<label>选择图片文件</label>
<input name="imgfile" type="file" accept="image/gif, image/jpeg"/>
<input name="upload" type="submit" value="上传" />
</form>
</body>
不同的浏览器，对于文件域控件的显示不同，IE9浏览器和FireFox中的预览效果都要看一下
代码中，重要的是名为imgfile的文件域控件，type属性为“file”，表示这是一个文件域控件。
accept属性表示点击“浏览...”按钮时，弹出的打开对话框中的文件类型。accept="image/gif, image/jpeg"表示我们只想在文件打开对话框中显示后缀名为“gif”和“jpg”、“jpeg”的文件。对于此属性，有些浏览器并不支持。比如在IE9中，此属性不起任何作用。在chrome中，此属性起作用。
如果想支持所有的图像文件，accept值可以设置为“image/*”，在chrome中，文件类型显示
好了，html代码就写完了，因为action=""，表示点击上传按钮时，将表单提交给自身，因此，我们还要添加接收表单的处理代码。
代码如下：
<?php
if (isset($_FILES['imgfile'])
&& is_uploaded_file($_FILES['imgfile']['tmp_name']))
{
$imgFile = $_FILES['imgfile'];
$imgFileName = $imgFile['name'];
$imgType = $imgFile['type'];
$imgSize = $imgFile['size'];
$imgTmpFile = $imgFile['tmp_name'];
move_uploaded_file($imgTmpFile, 'upfile/'.$imgFileName);
$validType = false;
$upRes = $imgFile['error'];
if ($upRes == 0)
{
if ($imgType == 'image/jpeg'
|| $imgType == 'image/png'
|| $imgType == 'image/gif')
{
$validType = true;
}
if ($validType)
{
$strPrompt = sprintf("文件%s上传成功<br>"
. "文件大小: %s字节<br>"
. "<img src='upfile/%s'>"
, $imgFileName, $imgSize, $imgFileName
);
echo $strPrompt;
}
}
}
?>
代码分析：
$_FILES是一个数组变量，用于保存上传后的文件信息。
$_FILES['imgfile']表示文件域名称为'imgfile'的控件提交服务器后，上传的文件的信息。
一个上传的文件，有以下属性信息：
'name'： 上传的文件在客户端的名称。
'type'： 文件的 MIME 类型，例如"image/jpeg"。
'size'： 已上传文件的大小，单位为字节。
'tmp_name'：上传时，在服务器端，会把上传的文件保存到一个临时文件夹中，可以通过此属性得到临时文件名。
'error'：文件在上传过程中的错误代码。如果上传成功，此值为0，其它值的意义如下：
1：超过了php.ini中设置的上传文件大小。
2：超过了MAX_FILE_SIZE选项指定的文件大小。
3：文件只有部分被上传。
4：文件未被上传。
5：上传文件大小为0。
代码中首先判断$_FILES['imgfile']变量是否存在，如果存在，并且$_FILES['imgfile']['tmp_name']变量所指文件被上传了，判断error属性，如果属性为0，把上传后的图像从临时文件夹移到upfile文件夹中，显示上传文件的信息，并显示上传后的图像。
如果error值不为0，表示上传失败，显示失败信息。
完成的代码如下：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "www.mobiletrain.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="www.mobiletrain.org">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>上传图片文件</title>
</head>
<?php
if (isset($_FILES['imgfile'])
&& is_uploaded_file($_FILES['imgfile']['tmp_name']))
{
$imgFile = $_FILES['imgfile'];
$upErr = $imgFile['error'];
if ($upErr == 0)
{
$imgType = $imgFile['type']; //文件类型。
/* 判断文件类型，这个例子里仅支持jpg和gif类型的图片文件。*/
if ($imgType == 'image/jpeg'
|| $imgType == 'image/gif')
{
$imgFileName = $imgFile['name'];
$imgSize = $imgFile['size'];
$imgTmpFile = $imgFile['tmp_name'];
/* 将文件从临时文件夹移到上传文件夹中。*/
move_uploaded_file($imgTmpFile, 'upfile/'.$imgFileName);
/*显示上传后的文件的信息。*/
$strPrompt = sprintf("文件%s上传成功<br>"
. "文件大小: %s字节<br>"
. "<img src='upfile/%s'>"
, $imgFileName, $imgSize, $imgFileName
);
echo $strPrompt;
}
else
{
echo "请选择jpg或gif文件，不支持其它类型的文件。";
}
}
else
{
echo "文件上传失败。<br>";
switch ($upErr)
{
case 1:
echo "超过了php.ini中设置的上传文件大小。";
break;
case 2:
echo "超过了MAX_FILE_SIZE选项指定的文件大小。";
break;
case 3:
echo "文件只有部分被上传。";
break;
case 4:
echo "文件未被上传。";
break;
case 5:
echo "上传文件大小为0";
break;
}
}
}
else
{
/*显示表单。*/
?>
<body>
<form action="" method="post" enctype="multipart/form-data" name="upload_form">
<label>选择图片文件</label>
<input name="imgfile" type="file" accept="image/gif, image/jpeg"/>
<input name="upload" type="submit" value="上传" />
</form>
</body>
<?php
}
?>
</html>