asp.net razor:拾取本Map像

2wnc66cl  于 2023-05-02  发布在  .NET
关注(0)|答案(1)|浏览(135)

我试图创建一个表单,用户可以选择一个图像与图像显示,而无需提交页面。
到目前为止,我在前端做了这个:

<tr>
    <td>
        <input type="file" name="updoc" id="upoc" class="form-control" />
    </td>
    <td>
        <img id="Userpic" class="pull-right" style="margin-bottom: 7px" width="180" height="100" src="@ViewBag.pic" />
    </td>
</tr>

它显示一个输入字段来选择图像。一旦图像被拾取,它会在页面上显示文件名,但不会显示其他内容。
我不知道如何显示我刚刚检索的图像。任何帮助将不胜感激!

yhxst69z

yhxst69z1#

你可以使用jquery FileReader来实现。

<script>
    $('#upoc').bind('change', function () {
        var reader = new FileReader();
        reader.onload = function (e) {
            $('#Userpic').attr('src', e.target.result);
        };

        reader.readAsDataURL($(this)[0].files[0]);
    });
</script>

相关问题