js上传展示本地图片

Posted 2020-10-24 纵观

请求的Js：

<script type="text/javascript">
    $(function () {
        $(‘#<?php echo $k; ?>‘).change(function () {
            var url = getFileUrl(‘<?php echo $k; ?>‘);
            if(url == ‘‘){
                $(‘#<?php echo $k; ?>_img‘).css(‘display‘,‘none‘);
            }else{
                $(‘#<?php echo $k; ?>_img‘).attr(‘src‘,url).css(‘display‘,‘‘);
                $(‘#<?php echo $k; ?>_err‘).html(‘‘);
            }
        });
    })

function getFileUrl(sourceId) {
    var url;
    if (navigator.userAgent.indexOf("MSIE")>=1) { // IE
        url = document.getElementById(sourceId).value;
    } else if(navigator.userAgent.indexOf("Firefox")>0) { // Firefox
        url = window.URL.createObjectURL(document.getElementById(sourceId).files.item(0));
    } else if(navigator.userAgent.indexOf("Chrome")>0) { // Chrome
        url = window.URL.createObjectURL(document.getElementById(sourceId).files.item(0));
    }else{
        url = window.URL.createObjectURL(document.getElementById(sourceId).files.item(0));
    }
    return url;
}

</script>

<form action="/mobile/my_order_controller/do_trademark_operation" method="post" id="form" enctype="multipart/form-data" onkeydown="if(event.keyCode==13)return false;"></form>

后端处理：
通过 $_FILES 接收存储图片