Beispiel-Tutorial für ein Bild zur Dateisteuerungsauswahl

So zeigen Sie die Bilder gleichzeitig auf img an, wenn Sie Bilder mit dem FileUpload-Steuerelement durchsuchen und auswählen (ohne auf Hochladen zu klicken):
Ich habe lange danach gesucht Du gehörst mir und kannst es noch einmal versuchen.
Js-Teil:

<script type="text/javascript">
    function ShowImg(obj) {
        var AllowExt = ".jpg|.gif|.bmp|.png|";
        var FileExt = obj.value.substr(obj.value.lastIndexOf(".")).toLowerCase();
        if (AllowExt != 0 && AllowExt.indexOf(FileExt + "|") == -1) //判断文件类型是否允许上传
        {
            alert("您上传的不是图片！");
        }
        else {
            var newPreview = document.getElementById("PreviewImg2");
            newPreview.src = obj.value;
        }
    }
</script>

Körperteil:

<img id="PreviewImg2" alt="" src="" width="140px" height="115px" />
 <asp:FileUpload ID="FileUpload1" runat="server" onchange="ShowImg(this)" />

Diese Methode wurde von mir persönlich getestet und kann hoffentlich angewendet werden hilfreich für Sie! Wenn es funktioniert, vergessen Sie nicht, es zu mögen! ! !

Der Code lautet wie folgt:

        3f1c4e4b6b16bbbd69b2ee476dc4f83a$(function() {
                $("#Book_Fiel").change(function() {var $file = $(this);var fileObj = $file[0];var windowURL = window.URL || window.webkitURL;var dataURL;var $img = $("#Book_Picture");if (fileObj && fileObj.files && fileObj.files[0]) {
                        dataURL = windowURL.createObjectURL(fileObj.files[0]);
                        $img.attr('src', dataURL);
                    } else {
                        dataURL = $file.val();var imgObj = document.getElementById("preview");// 两个坑:// 1、在设置filter属性时，元素必须已经存在在DOM树中，动态创建的Node，也需要在设置属性前加入到DOM中，先设置属性在加入，无效；// 2、src属性需要像下面的方式添加，上面的两种方式添加，无效；imgObj.style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod=scale)";
                        imgObj.filters.item("DXImageTransform.Microsoft.AlphaImageLoader").src = dataURL;

                    }                });
            }
            );
            2cacc6d41bbb37262a98f745aa00fbf0

Das obige ist der detaillierte Inhalt vonBeispiel-Tutorial für ein Bild zur Dateisteuerungsauswahl. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!