哪位高手有Jquery+C#实现的单张图片上传并且预览的实例
日期：2014-05-18 浏览次数：20499 次
谁有Jquery+C#实现的单张图片上传并且预览的实例？
谁有Jquery+C#实现的单张图片上传并且预览的实例？
1.语言：Jquery+C#或Ajax
2.单张图片上传
3.上传时实现预览
4.同时兼容多个浏览器
【绝对结贴】
------解决方案--------------------
http://www.xueit.com/html/2010-05/33-2104252279201058153012328.html 去看看 应该可以
------解决方案--------------------
http://lovetopceo.javaeye.com/blog/654767
http://www.open-open.com/ajax/2_Upload.htm
------解决方案--------------------
帮lz顶....
学习...............
------解决方案--------------------
1.<html >
2.<head>
3.<meta http-equiv="Content-Type" content="text/html; charset=gbk" />
4.<script type="text/javascript" src="jquery-1.3.2.js"></script>//注意要导入Jquery的类库
5.<script language="javascript">
6.$(function(){
7. var ei = $("#large");//获取Div
8. ei.hide();
9. $("#img1, img").mousemove(function(e){//img1是 显示 上传图片的缩略图
10.//鼠标经过的时候 给div加上 图片
11. ei.css({top:e.pageY,left:e.pageX}).html('<img style="border:1px solid gray;" src="' + this.src + '" />').show();
12. }).mouseout( function(){
13. ei.hide();//否则 就隐藏
14. })
15. $("#f1").change(function(){ //上传 控件 上传的 预览
16. $("#img1").attr("src","file:///"+$("#f1").val());
17. })
18.});
19.</script>
20.<style type="text/css">
21. #large{position:absolute;display:none;z-index:999;}
22.</style>
23.</head>
24.<body>
25.上传预览图片:<br>
26.<input id="f1" name="f1" type="file" /><br>
27.<img id="img1" width="120" height="60" src="http://www.hualang.net/images/hualanglogo.jpg">
28.<div id="large"></div>
29.<br><br><br><br><br><br>
30.鼠标滑过预览图片:<br>
31.<img width="120" height="60" src="http://www.hualang.net/images/hualanglogo.jpg"><br>
32.<img width="120" height="60" src="http://www.hualang.net/images/hualanglogo.jpg"><br>
33.</body>
34.</html>
<html >
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gbk" />
<script type="text/javascript" src="jquery-1.3.2.js"></script>//注意要导入Jquery的类库
<script language="javascript">
$(function(){
var ei = $("#large");//获取Div
ei.hide();
$("#img1, img").mousemove(function(e){//img1是 显示 上传图片的缩略图
//鼠标经过的时候 给div加上 图片
ei.css({top:e.pageY,left:e.pageX}).html('<img style="border:1px solid gray;" src="' + this.src + '" />').show();
}).mouseout( function(){
ei.hide();//否则 就隐藏
})
$("#f1").change(function(){ //上传 控件 上传的 预览
$("#img1").attr("src","file:///"+$("#f1").val());
})
});
</script>
<style type="text/css">
#large{position:absolute;display:none;z-index:999;}
</style>
</head>
<body>
上传预览图片:<br>
<input id="f1" name="f1" type="file" /><br>
<img id
谁有Jquery+C#实现的单张图片上传并且预览的实例？
1.语言：Jquery+C#或Ajax
2.单张图片上传
3.上传时实现预览
4.同时兼容多个浏览器
【绝对结贴】
------解决方案--------------------
http://www.xueit.com/html/2010-05/33-2104252279201058153012328.html 去看看 应该可以
------解决方案--------------------
http://lovetopceo.javaeye.com/blog/654767
http://www.open-open.com/ajax/2_Upload.htm
------解决方案--------------------
帮lz顶....
学习...............
------解决方案--------------------
1.<html >
2.<head>
3.<meta http-equiv="Content-Type" content="text/html; charset=gbk" />
4.<script type="text/javascript" src="jquery-1.3.2.js"></script>//注意要导入Jquery的类库
5.<script language="javascript">
6.$(function(){
7. var ei = $("#large");//获取Div
8. ei.hide();
9. $("#img1, img").mousemove(function(e){//img1是 显示 上传图片的缩略图
10.//鼠标经过的时候 给div加上 图片
11. ei.css({top:e.pageY,left:e.pageX}).html('<img style="border:1px solid gray;" src="' + this.src + '" />').show();
12. }).mouseout( function(){
13. ei.hide();//否则 就隐藏
14. })
15. $("#f1").change(function(){ //上传 控件 上传的 预览
16. $("#img1").attr("src","file:///"+$("#f1").val());
17. })
18.});
19.</script>
20.<style type="text/css">
21. #large{position:absolute;display:none;z-index:999;}
22.</style>
23.</head>
24.<body>
25.上传预览图片:<br>
26.<input id="f1" name="f1" type="file" /><br>
27.<img id="img1" width="120" height="60" src="http://www.hualang.net/images/hualanglogo.jpg">
28.<div id="large"></div>
29.<br><br><br><br><br><br>
30.鼠标滑过预览图片:<br>
31.<img width="120" height="60" src="http://www.hualang.net/images/hualanglogo.jpg"><br>
32.<img width="120" height="60" src="http://www.hualang.net/images/hualanglogo.jpg"><br>
33.</body>
34.</html>
<html >
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gbk" />
<script type="text/javascript" src="jquery-1.3.2.js"></script>//注意要导入Jquery的类库
<script language="javascript">
$(function(){
var ei = $("#large");//获取Div
ei.hide();
$("#img1, img").mousemove(function(e){//img1是 显示 上传图片的缩略图
//鼠标经过的时候 给div加上 图片
ei.css({top:e.pageY,left:e.pageX}).html('<img style="border:1px solid gray;" src="' + this.src + '" />').show();
}).mouseout( function(){
ei.hide();//否则 就隐藏
})
$("#f1").change(function(){ //上传 控件 上传的 预览
$("#img1").attr("src","file:///"+$("#f1").val());
})
});
</script>
<style type="text/css">
#large{position:absolute;display:none;z-index:999;}
</style>
</head>
<body>
上传预览图片:<br>
<input id="f1" name="f1" type="file" /><br>
<img id
免责声明： 本文仅代表作者个人观点，与爱易网无关。其原创性以及文中陈述文字和内容未经本站证实，对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺，请读者仅作参考，并请自行核实相关内容。
