2

这是我需要做的。所以我有这个代码

 <input type="file" id="uploadImage" name="image" />
    <input type="submit" id="ImageName" name="submit" value="Submit">

因此，当我单击“选择..”按钮浏览图像时，我希望将该图像的路径保存在变量中。

或者基本上我需要做的是使这条路径成为图像的 src 。

$('#Imageholder').append('<img src="" class="ImgCoords" >');

有任何想法吗？

抱歉，如果解释不好：

4

2 回答 2

5

这是我制作的一个示例，请根据您的需要进行调整：

在这里演示

我添加了一个按钮删除上传的文件，如果您不喜欢显示/隐藏效果只需删除slow，图像仅在上传时显示：

$('#blah').hide();
$('#remove').hide();  
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]);
        }
    }

    $("#imgInp").change(function(){
        if( $('#imgInp').val()!=""){

            $('#remove').show();
            $('#blah').show('slow');
      }
        else{ $('#remove').hide();$('#blah').hide('slow');}
        readURL(this);
    });


    $('#remove').click(function(){
          $('#imgInp').val('');
          $(this).hide();
          $('#blah').hide('slow');
          $('#blah').attr('src','http://upload.wikimedia.org/wikipedia/commons/thumb/4/40/No_pub.svg/150px-No_pub.svg.png');
});

HTML 代码：

<form id="form1">
    <input type='file' id="imgInp" name='image'/>
    <img id="blah" src="#" alt="your image" />
</form>
于 2013-09-25T15:06:20.187 回答
1

如果你正在使用HTML5，你可以。

有关文件 API，请参见此处。由W3C

API的以下关键行

  var file = document.getElementById('file').files[0];

但是如果你不使用HTML5

出于安全原因，您不能这样做。html 无权访问文件系统信息。

可能有用：在上传之前预览图像

于 2013-09-25T15:03:56.740 回答