Javascript 下载重新发行的图像及其'；新的宽度和高度是多少

基本上，我正在尝试调整图像的大小，并用新的宽度和高度下载它，但它只下载它的原始版本：

jQuery(document).ready(function() {

    jQuery(function () {
            jQuery(":file").change(function () {
                if (this.files && this.files[0]) {
                    var reader = new FileReader();
                    reader.onload = imageIsLoaded;
                    reader.readAsDataURL(this.files[0]);

                    orginalWidth = $("#image").width();
                    orginalheight = $("#image").height();
                    // alert(orginalheight);
                    var images = jQuery('.thumb-wrapper img'); //caches the query when dom is ready
                    // var CELL_WIDTH = 150;
                    var ASPECT = 1.5;

                    jQuery( "#slider" ).slider({
                        step: 5,
                        min: 70,
                        max: 200,
                        value: 100,
                        slide: function(event, ui) {
                            var size = (orginalWidth * ui.value /10) + "px";
                            // alert(size);
                            images.stop(true).animate({width: size, height: size / ASPECT}, 250);
                        }
                    });
                }
            });
        });

        function imageIsLoaded(e) {
            jQuery("#download").removeAttr("style");
            jQuery("#file").css("display", "none");
            jQuery('#image').attr('src', e.target.result);
            jQuery('#download').attr('href', e.target.result);
        };

});

HTML:

<div id="slider"></div>

<div class="file-list">
 <div class="file-cell">
    <div class="thumb-wrapper">
        <input id="file" type='file' style=""/>
        <img id="image" src="#" alt="your image" />
        <a id="download" href="#" download="filename.jpg" style="display:none;">Download</a>
    </div>
  </div>
</div>

这里有一个

---

有什么解决办法吗？非常感谢

现在要做的是让浏览器在视口中调整图像大小，而不改变原始图像。

---

您需要做的是编写一个脚本来调整图像服务器端的大小。您可以使用jQuery将图像发布到服务器，然后将调整大小的图像取回。

我这样做是为了上传而不是下载。我可能错了，但要做到这一点，我要做的第一件事是在服务器上对文件进行重新采样，然后ajax获得重新采样的文件。这是正确的，我只是想输入PHP库（GD）的名称及其文档的链接。我完全同意你的答案+1他没有提到他可以使用什么编程语言，所以我没有回答。如果他真的使用PHP，GD的一个很好的替代品可能是ImageMagick。这是真的，考虑到大多数网站都运行PHP，这是一个相当不错的猜测。我只读过ImageMagick，听过一些好东西。有没有一个脚本可以根据img属性宽度调整图像大小？我想你需要自己制作一个服务器脚本。我不确定是否有为这个任务准备的脚本，因为它相当小。您可以使用jQuery将图像连同所需的宽度一起发送到服务器，然后使用Imagick调整其大小。小示例（在PHP中）：

$image=new-Imagick（'example_in.png'）$图像->缩略图图像（300,0）$image->writeImage（'example_out.png'）。这将使图像的宽度为300px。