layui表单与上传图片
@{ Layout = null; } <!DOCTYPE html> <html> <head> <meta name="viewport" content="width=device-width" /> <title>Add</title> <link href="~/layui/css/layui.css" rel="stylesheet" /> <script src="~/Scripts/jquery-3.4.1.js"></script> </head> <body> <div> <form action="/" method="post" class="layui-form"> <div class="layui-form-item"> <label class="layui-form-label">头像</label> <div class="layui-input-block"> <input type="image" name="UImg" id="test2" src="" value="" /> <button type="button" class="layui-btn" id="test1"> <i class="layui-icon"></i>上传图片 </button> </div> </div> <div class="layui-form-item"> <label class="layui-form-label">用户名</label> <div class="layui-input-block"> <input type="text" name="UName" required lay-verify="required" placeholder="请输入用户名" class="layui-input" /> </div> </div> <div class="layui-form-item"> <label class="layui-form-label">密码</label> <div class="layui-input-block"> <input type="password" name="UPwd" required lay-verify="required" placeholder="请输入密码" class="layui-input" /> </div> </div> <div class="layui-form-item"> <label class="layui-form-label">性别</label> <div class="layui-input-block"> <input type="radio" name="USex" value="男" title="男" checked /> <input type="radio" name="USex" value="女" title="女" /> </div> </div> <div class="layui-form-item"> <label class="layui-form-label">爱好</label> <div class="layui-input-block"> <input type="checkbox" name="UHobby" value="写作" title="写作" checked /> <input type="checkbox" name="UHobby" value="阅读" title="阅读" /> <input type="checkbox" name="UHobby" value="发呆" title="发呆" /> </div> </div> <div class="layui-form-item layui-form-text"> <label class="layui-form-label">描述</label> <div class="layui-input-block"> <textarea name="URemark" placeholder="请输入内容" class="layui-textarea"></textarea> </div> </div> <div class="layui-form-item"> <div class="layui-input-block"> <button class="layui-btn" lay-submit lay-filter="formDemo">立即提交</button> </div> </div> </form> </div> <script src="~/layui/layui.all.js"></script> <script> layui.use('upload', function () { var upload = layui.upload; var uploadInst = upload.render({ elem: "#test1", url: "https://localhost:44304/api/Upload/Post", done: function (res) { console.log(res); layui.$("#test2").attr('src', 'https://localhost:44304' + res.data.src); layui.$("#test2").attr('value','https://localhost:44304'+ res.data.src); alert('上传成功'); }, error: function () { } }) }) layui.use('form',function () { var form = layui.form; form.on('submit(formDemo)', function (data) { console.log(data); $.ajax({ url: "https://localhost:44304/api/userinfos/Post", data: data.field, type:"Post", success: function () { alert('成功'); location.href = '/UserInfoS/Index'; } }) return false; } ) }) </script> </body> </html>