在线头像上传（js）

 

复制代码
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title></title>
    <script src="jquery-1.8.3.min.js"></script>
</head>
<body>
    <div id="divimg" >
   </div>
    <input type="button" name="name" value="上传" id="btnUpload"/>
    <div >
        <img src="" id="selectId" style="width:100px; height:100px" />
    </div>

</body>
</html>
<script>
    $(function (e) {
        var arrImg = ["0.jpg", "1.jpg", "2.jpg", "3.jpg", "4.jpg", "5.jpg",
            "6.jpg", "7.jpg", "8.jpg", "9.jpg", "10.jpg", "11.jpg", "12.jpg"];
        $("#divimg").append(function () {
            for (var i = 0; i < arrImg.length; i++) {
                $("#divimg").append("<img src='img/" + arrImg[i] + "', style='width:100px; height:100px' class='eachImg'/><&nbsp;&nbsp;/>");
            }
        });
    //});

    //$(function () {
        $(".eachImg").click(function () {
            var src = $(this).attr("src");
            //alert(src.replace("img/", ""));
            $("#selectId").attr("src", src);
        });

        $("#btnUpload").click(function () {
            var srcimg = $("#selectId").attr("src").replace("img/", "");
            $.ajax({
                type: "POST",
                url: "/Home/DownloadFile",
                contentType: "application/json",
                data: srcimg
            });
        });
    });
</script>
复制代码

 

posted @   雪？  阅读(337)  评论(4)  编辑  收藏  举报
编辑推荐：
· go语言实现终端里的倒计时
· 如何编写易于单元测试的代码
· 10年+ .NET Coder 心语，封装的思维：从隐藏、稳定开始理解其本质意义
· .NET Core 中如何实现缓存的预热？
· 从 HTTP 原因短语缺失研究 HTTP/2 和 HTTP/3 的设计差异
阅读排行：
· 周边上新：园子的第一款马克杯温暖上架
· Open-Sora 2.0 重磅开源！
· 分享 3 个 .NET 开源的文件压缩处理库，助力快速实现文件压缩解压功能！
· Ollama——大语言模型本地部署的极速利器
· DeepSeek如何颠覆传统软件测试？测试工程师会被淘汰吗？
点击右上角即可分享
微信分享提示
AI IDE Trae