我将在表单中预览图像或照片,但它不起作用,HTML代码如下所示:
<form action="" method="post" enctype="multipart/form-data" name="personal_image" id="newHotnessForm"> <p><label for="image">Upload Image:</label> <input type="file" id="imageUpload"/></p> <p><button type="submit" class="button">Save</button></p> <div id="preview"> <img width="160px" height="120px" src="profile pic.jpg" id="thumb" /> </div> </form>
并在下面合并了JS代码/脚本:
<script type="text/jaavascript"> $(document).ready(function(){ var thumb=$('#thumb'); new AjaxUpload('imageUpload',{ action:$('newHotnessForm').attr('action'),name:'image',onSubmit:function(file,extension){ $('#preview').addClass('loading'); },onComplete:function(file,response){ thumb.load(function(){ $('#preview').removeClass('loading'); thumb.unbind(); }); thumb.attr('src',response); } }); });
我的表格上有两个主要问题:
1.为什么图像或图片的预览不起作用?
2.如何在单击保存按钮时粘贴表单中的照片,它将链接到我创建的另一个PHP或PHP页面?
解决方法
试试这个:(预览)
<script type="text/javascript"> function readURL(input) { if (input.files && input.files[0]) { var reader = new FileReader(); reader.onload = function (e) { $('#blah').attr('src',e.target.result); } reader.readAsDataURL(input.files[0]); } } </script> <body> <form id="form1" runat="server"> <input type='file' onchange="readURL(this);" /> <img id="blah" src="#" alt="your image" /> </form> </body>
工作演示here>
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。