导航:首页 > 编程语言 > php弹出图片窗口

php弹出图片窗口

发布时间:2022-04-18 17:23:56

php图片上传前预览怎么实现!!

1.先创建一个file表单域,我们需要用它来浏览本地文件。
<form name="form1" id="form1" method="post" action="upload.php">
<input type="file" name="file1" id="file1" />
</form>
2.试下效果:
判断文件类型:
当用户选择了一个图片文件时,希望他能马上看到这张图片的缩略图,以便他能确认没有把自己的光屁股照片当作头像传到服务器上^_^。
在预览之前还得先判断一下用户选择的是不是一个图像文件,如果他想用一个.rar文件做头像的话我们也需要礼貌地提醒一下。
<form name="form2" id="form2" method="post" action="upload.php">
<input type="file" name="file2" id="file2"
onchange="preview()" />
</form>
javascript函数实现,注意使用DOM方法getElementById来访问对象。不要再使用form
和input的name属性来访问对象了,只有IE才这么干。<script type="text/javascript">
function preview2(){
var x = document.getElementById("file2");
if(!x || !x.value) return;
if(x.value.indexOf(".jpg")<0
&& x.value.indexOf(".jpeg")<0
&& x.value.indexOf(".gif")<0){
alert("您选择的似乎不是图像文件。");
}else{
alert("通过");
}
}
</script>
3.试下效果:

这里有一个问题,如果用户选择了名为“fake.jpg.txt”的文件,这段脚本仍旧会认为这是一个合法的图像文件。一个可行的解决方案是先 把文件名转换成小写,再取文件路径的最后4到5位,判断一下文件的扩展名是否确为支持的图像文件扩展名。不过这种方案略显笨拙,也没有什么美感可言, 我们换一种方案:用“正则表达式”来判断文件扩展名。
<script type="text/javascript">
function preview3(){
var x = document.getElementById("file3");
if(!x || !x.value) return;
var patn = /\.jpg$|\.jpeg$|\.gif$/i;
if(patn.test(x.value)){
alert("通过");
}else{
alert("您选择的似乎不是图像文件。");
}
}
</script>
4.看看效果(可以自己创建一个“fake.jpg.txt”文件试试):

回到这段脚本上来,即使你还看不懂正则表达式那两行,但整段脚本的美感还是很明显的:简洁、直接、语义流畅,这与Web标准关于XHTML的要求是一致的,与Web设计师或开发者天生的“完美”主义也是一致的。
jjww一大段之后,转入重点——预览图片
预览功能的基本设计思路是很清晰的:创建一个img元素,再把文件域的value值赋值给img
元素的src属性。<form name="form4" id="form4" method="post" action="#">
<input type="file" name="file4" id="file4"
onchange="preview4()" />
<img id="pic4" src="http://blog.163.com/lgh_2002/blog/" alt="图片在此显示" width="120"/>
</form>
<script type="text/javascript">
function preview4(){
var x = document.getElementById("file4");
var y = document.getElementById("pic4");
if(!x || !x.value || !y) return;
var patn = /\.jpg$|\.jpeg$|\.gif$/i;
if(patn.test(x.value)){
y.src = "file://localhost/" + x.value;
}else{
alert("您选择的似乎不是图像文件。");
}
}
</script>
5.试下效果:

如果用的是Firefox(或Opera),可能会发现什么也没有发生。是的,很不幸Firefox的安全策略不允许显示一个用户的本地 图像文件。不知道为什么要这么做,个人觉得图像文件并不会造成严重的安全性问题。即使是不久前比较热门的那个会引起Windows崩溃的jpeg文 件,要显示它的前提条件是用户自己选择了这个文件或者你知道这个文件在用户硬盘上的准确路径。所以我想这种策略很可能来自于一个“懒惰”的开发人员,并 不想多写一些程序来区分这个本地文件是一个图像文件还是一个恶意文件,Firefox对安全性的要求让他们有些过于敏感了。
让Firefox显示本地文件的唯一办法就是修改它的默认安全策略:
在Firefox的地址栏中输入“about:config”
继续输入“security.checkloari”
双击下面列出来的一行文字,把它的值由true改为false
然后你可以再试试上面预览,everything works well!可惜的是并不能要求所有的用户都去修改这个值(更不用说修改的过程还挺麻烦),所以毫无意义。我们能做的也许就是接受Firefox不能预览本地图片这种“可笑”的局面。
用DOM来创建对象
在上面的XHTML代码中,为了预览图片,事先加入了一个没有设置src的img对象。除去不美观、代码冗余之外,如果用户浏览器不支持 Javascript,不仅无法使用这个功能,还要接受页面上一个永远不会显示出来的破图。要解决这个问题,就需要在“运行时”再生成这个img对 象,途径还是DOM。
<form name="form5" id="form5" method="post" action="#">
<input type="file" name="file5" id="file5"
onchange="preview5()"/>
</form>
<script type="text/javascript">
function preview5(){
var x = document.getElementById("file5");
if(!x || !x.value) return;
var patn = /\.jpg$|\.jpeg$|\.gif$/i;
if(patn.test(x.value)){
var y = document.getElementById("img5");
if(y){
y.src = 'file://localhost/' + x.value;
}else{
var img=document.createElement('img');
img.setAttribute('src','file://localhost/'+x.value);
img.setAttribute('width','120');
img.setAttribute('height','90');
img.setAttribute('id','img5');
document.getElementById('form5').appendChild(img);
}
}else{
alert("您选择的似乎不是图像文件。");
}
}
</script>
6.试下效果:

这样就相对比较完美了。DOM和正则表达式一样,都是“包你不悔”的实 用技术,如果你希望更多了解、深入学习、或者顺利实践Web标准,DOM是不可或缺的。从本人最近的体会来说,Javascript+DOM+CSS蕴 藏着强大的能量,就看怎么释放它了。

7.最后帖上JQUERY的上传预览代码:

de><html xmlns="http://www.w3.org/1999/xhtml" >
<head id="Head1">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/javascript" src="http://blog.163.com/lgh_2002/blog/jquery.js"></script>
<script language="javascript">
$(function(){
var ei = $("#large");
ei.hide();
$("#img1").mousemove(function(e){
ei.css({top:e.pageY,left:e.pageX}).html('<img style="border:1px solid gray;" src="http://blog.163.com/lgh_2002/blog/' + this.src + '" />').show();
}).mouseout( function(){
ei.hide("slow");
})
$("#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>
<form name="form1" id="form1">
<div id="demo">
<input id="f1" name="f1" type="file" />
<img id="img1" width="60" height="60">
</div>
<div id="large"></div>
</form>
</body>
</html>de>

Ⅱ PHP如何自动下载图片并存入文件中,不是那种触发后会弹出窗口的而是能自动在后台完成的

functiondownload_remote_file($file_url,$save_to)
{
$content=file_get_contents($file_url);
file_put_contents($save_to,$content);
}

执行上边的方法$this->download_remote_file($from_url,$savename);

$from_url为图片的路径 $savename为要保存的路径(绝对路径)

Ⅲ PHP 无法在页面中显示图片

你不能保存成html的文件应该是PHP的你这个直接就当作普通的输出了怎么能成呢?

Ⅳ PHP上传刷新重复出现图片问题

用 令牌机制
先生成个随机字符串,存在session里.
例如:
if(!isset($_SESSION['verify'])){
$_SESSION['verify'] = gmmktime();
}
然后在 html的表单中加个隐藏字段
<input type="hidden" name="verify" value="<?=$_SESSION['verify']?>" />

在表单提交的时候,检查提交上来的verify的值 是否等于 session里存的
if($_POST['verify']!=$_SESSION['verify']){
die('请勿重复提交');
}else{
unset($_SESSION['verify']);
//做上传需要做的事情.....

}

不会干扰正常的文件上传的.

正常的表单里 你得有verify 的值 呀

Ⅳ php制作后台,上传图片,点击上传,弹出一个图片库,从图片库里面选择图片,如何实现

这里单独依靠php是不能实现的,需要结合php和javascript
在服务器端,需要制作一个php文件,接收一个请求后,会遍历相应的目录或者查询数据库,将查询到的结果(包含图片总数,以及一个当前页的图片信息列表,列表中要包含图片的地址、文件名、创建时间等信息)已json的形式返回。
在客户端,需要使用javascript实现点击时弹出窗口,并且在用户点击相应的项目的时候向服务器端的php文件发送请求,接收结果,然后将结果生成图中的html代码,显示出来。
制作这样的东西需要的时间不短,中间还会发生各种问题,需要有耐心。另外,直接使用javascript来制作客户端部分的话效率不高,建议结合jQuery来实现。

阅读全文

与php弹出图片窗口相关的资料

热点内容
php如何选中相同的进行修改 浏览:623
工行app个人怎么给企业账户转账 浏览:149
汇编与程序员 浏览:666
压缩包解码器下载 浏览:130
爱旅行的预备程序员 浏览:111
安卓qq浏览器怎么转换到ios 浏览:292
不同编译器的库可以调用吗 浏览:455
灰度信托基金加密 浏览:421
宿迁程序员兼职网上接单 浏览:924
电视编译器怎么设置 浏览:276
手机如何解压汉字密码的压缩包 浏览:701
为什么很多程序员爱用vim 浏览:828
安卓手机怎么连接宝华韦健音响 浏览:555
12星座制作解压球 浏览:867
java调用oracle数据 浏览:827
怎么在服务器上上传小程序源码 浏览:304
空中加油通达信指标公式源码 浏览:38
分卷解压只解压了一部分 浏览:760
php网站自动登录 浏览:705
合肥凌达压缩机招聘 浏览:965