upload动态添加参数

提问 未结 7 162
joycewu
joycewu 2020-2-22
悬赏:50飞吻
版本:layui 2.3.3 浏览器:ie8
如下所示为我的代码,我发现upload控件在ie8下面render之后,无论怎么改变data参数,即使在before方法中alert出来的参数也是改变之后的值,但是向服务器发送的请求的参数不会改变,一直都是render之后的默认值
var uploadIns = upload.render({
elem: elem
,url: baseUrl+url
,accept: 'file'
,method: 'post'
,acceptMime: '*'
,data: {
isCover: function(){
return document.getElementById("isCover").checked == true?1:0;
}
}
,before: function(input) {
uploadIns.config.data.isCover = document.getElementById("isCover").checked == true?1:0;
alert(JSON.stringify(uploadIns.config.data))
}
,done: function(res, index, upload){
if(res.success){
parent.layer.msg("导入成功!");
}else{
parent.layer.msg("导入失败!");
}
window.parent.location.reload();
var index = parent.layer.getFrameIndex(window.name);
parent.layer.close(index);
},error: function(){
parent.layer.msg("导入失败!");
var index = parent.layer.getFrameIndex(window.name);
parent.layer.close(index);
//请求异常回调
}
});
回帖
  • kely
    2020-2-22
    你应当把render看作绑定监听函数,js在读到此处时仅仅只是将该函数与elem绑定,而不是执行该函数,只有当点击elem时才触发该函数。
    你可以在声明upload.render函数前后以及render内任意回调中修改并alert一下isCover的值来验证此想法。
    0 回复
  • joycewu
    2020-2-22
    @kely 它本身的思路也是这样,我在其他任何地方调用isCover都是我修改之后的值,只有当我点击elem,触发上传操作向服务器发送这个参数的时候,这个参数的值不会改变
    0 回复
  • joycewu
    2020-2-22
    @kely 就是因为我理解它这个思路,所以我觉得出现这个问题很奇怪。讲道理的话,每次上传文件,我都会重新去获取并且重新set参数,这个参数应该是要改变的,可是服务器取到的值一直都是被改变之前的值
    0 回复
  • kely
    2020-2-22
    @joycewu 其他浏览器是否有这种情况?
    如果也有的话,这里提出一个可能性:代码中是否含有直接通过uploadIns.config.data进行的修改操作,如果通过这种方式赋值可能会将isCover由您所定义的函数变为固定值,具体是否影响,需要查看源码执行顺序..
    以下是源码中对data域赋值的代码
    //ie8-9初始化
    Class.prototype.initIE = function(){
    var that = this
    ,options = that.config
    ,iframe = $('<iframe id="'+ ELEM_IFRAME +'" class="'+ ELEM_IFRAME +'" name="'+ ELEM_IFRAME +'" frameborder="0"></iframe>')
    ,elemForm = $(['<form target="'+ ELEM_IFRAME +'" class="'+ ELEM_FORM +'" method="post" key="set-mine" enctype="multipart/form-data" action="'+ options.url +'">'//可以看到他是通过对dom添加表单的形式进行文件上传,
    ,'</form>'].join(''));

    //插入iframe
    $('#'+ ELEM_IFRAME)[0] || $('body').append(iframe);

    //包裹文件域
    if(!options.elem.next().hasClass(ELEM_FORM)){
    that.elemFile.wrap(elemForm);

    //追加额外的参数
    options.elem.next('.'+ ELEM_FORM).append(function(){
    var arr = [];
    layui.each(options.data, function(key, value){
    value = typeof value === 'function' ? value() : value; //注意此行以及下一行
    arr.push('<input type="hidden" name="'+ key +'" value="'+ value +'">')
    });
    return arr.join('');
    }());
    }
    };
    如果还是不行或许可以尝试直接修改生成的dom中input的值(逃

    0 回复
  • joycewu
    2020-2-24
    @kely 非常感谢,我尝试一下。我觉得这个源码应该是有问题的,这个只是在初始化的时候遍历获取了data参数,那如果这个参数进行改变了,有没有做监听,重新去追加额外参数呢?
    0 回复
  • kely
    2020-2-24
    @joycewu 如果是在ie8下的话,这个框架确实是没进行动态获取参数的。
    不过我推荐你可以自行修改一下源码。
            //追加额外的参数
    options.elem.next('.'+ ELEM_FORM).append(function(){
    var arr = [];
    layui.each(options.data, function(key, value){
    value = typeof value === 'function' ? value() : value;
    arr.push('<input type="hidden" name="'+ key +'" value="'+ value +'">')
    });
    return arr.join('');
    }());
    可以尝试在上方input标签内添加id参数,以key为值就好了,然后通过document.getElementById(‘你的key’)在上传前进行修改,key是你的参数名,像下面这样。
    arr.push('<input type="hidden" name="'+ key +'" id="'+key+'" value="'+ value +'">')
    虽然这个办法不是很好,但是在ie8下似乎没有更好的办法了..
    0 回复
  • joycewu
    2020-2-27
    @kely 试了一下这个方法 好像还是没啥作用,不过非常感谢你的回复。
    0 回复