js 动态追加file元素

function createInput(filedata){
var div1 = document.getElementById("div_Pic")
var filename = document.getElementsByName("filename")
var pathbool = true;
var a = 1;
if(filename.length>0){
for(var i = 0;i<filename.length;i++){
//判断是否存在没有浏览项
if(filename[i].value == "" ||filename[i].value==null||filename[i].value==undefined){
pathbool = false;
}
//判断是否存在相同的文件路径
if(filedata.value == filename[i].value){
a = a+1;
}
}
}
if(pathbool&&a<=2) {
var f = document.createElement("<input type='file' name='filename' οnchange='javascript:createInput(this)'/>");
div1.appendChild(f);
//div1.appendChild(d)
}
if(a>2){
b
div1.removeChild(filedata);
if(pathbool){
var f = document.createElement("<input type='file' name='filename' οnchange='javascript:createInput(this)'/>");
div1.appendChild(f);
}
}

}
</script>
好的,你可以使用 layui 的 xfile 模块的裁剪功能来实现动态切换裁剪尺寸。具体的步骤如下: 1. 在 layui 中引入 xfile 模块,并设置裁剪参数: ```javascript layui.use('upload', function(){ var upload = layui.upload; //执行实例 var uploadInst = upload.render({ elem: '#test1' //绑定元素 ,url: '/upload/' //上传接口 ,done: function(res){ //上传完毕回调 } ,error: function(){ //请求异常回调 } ,acceptMime: 'image/*' ,accept: 'images' ,size: 1024*10 ,exts: 'jpg|png|gif|bmp|jpeg' ,multiple: false ,auto: false ,bindAction: '#upload' ,field: 'file' ,choose: function(obj){ //将每次选择的文件追加到文件队列 var files = obj.pushFile(); //预读本地文件,如果是多文件,则会遍历。(不支持ie8/9) obj.preview(function(index, file, result){ //操作裁剪图片的区域 layui.use(['layer', 'laydate', 'laypage', 'upload', 'colorpicker', 'slider', 'xfile'], function () { var layer = layui.layer; var laydate = layui.laydate; var laypage = layui.laypage; var upload = layui.upload; var colorpicker = layui.colorpicker; var slider = layui.slider; var xfile = layui.xfile; //初始化裁剪 xfile.render({ elem: '#xfile' ,url: '/image/cut/' //上传接口 ,size: 1024*10 ,done: function(res){ //上传完毕回调 } ,error: function(){ //请求异常回调 } ,choose: function(obj){ //预读本地文件,如果是多文件,则会遍历。(不支持ie8/9) obj.preview(function(index, file, result){ //切换裁剪尺寸 xfile.config({ area: ['800px', '600px'] }); //操作裁剪图片的区域 xfile.cut({ src: result //图片路径 ,size: ['100px', '100px'] //裁剪尺寸 ,ok: function(base64){ //裁剪成功 } ,cancel: function(){ //取消裁剪 } }); }); } }); }); }); } }); }); ``` 2. 在选择图片后,通过调用 `xfile` 模块的 `config` 方法来动态修改裁剪的尺寸: ```javascript xfile.config({ area: ['800px', '600px'] }); ``` 3. 在裁剪图片时,通过传递裁剪尺寸参数来动态切换裁剪尺寸: ```javascript xfile.cut({ src: result //图片路径 ,size: ['100px', '100px'] //裁剪尺寸 ,ok: function(base64){ //裁剪成功 } ,cancel: function(){ //取消裁剪 } }); ``` 这样就可以实现动态选择裁剪尺寸的功能了。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值