假设你的数据设计的比较简单 下面是我的思路,如果是比较复杂设计也可以通过下面的思路进行扩展
公司主营业务:网站设计制作、成都网站制作、移动网站开发等业务。帮助企业客户真正实现互联网宣传,提高企业的竞争能力。成都创新互联公司是一支青春激扬、勤奋敬业、活力青春激扬、勤奋敬业、活力澎湃、和谐高效的团队。公司秉承以“开放、自由、严谨、自律”为核心的企业文化,感谢他们对我们的高要求,感谢他们从不同领域给我们带来的挑战,让我们激情的团队有机会用头脑与智慧不断的给客户带来惊喜。成都创新互联公司推出东坡免费做网站回馈大家。
首先要有每条记录的id,如果是表单提交每一行要有一个隐藏域来保存id
sc代表参数且是一个二维数组,键名是id值,键值是一个一维关联数组
post参数打印出来是下面这样,然后循环这个post数组 每循环一次根据id来进行更新品牌单价单位
如果是ajax提交 只要把传递的json数据自己拼装一下 后端打印出来和上面的post数据格式一样就可以了
form name="form4" id="form4" method="post" action="#" input type="file" name="file4" id="file4" ōnchange="preview4()" / img id="pic4" src="" alt="图片在此显示" width="120"/ /form scrīpt type="text/javascrīpt" function preview4(){ var x = document.getElementById("file4"); var y = document.getElementById("pic4"); if(!x || !x.value || !y) return; var patn = /\.jpg$|\.jpeg$|\.gif$/i; if(patn.test(x.value)){ y.src = "" + x.value; } else{ alert("您选择的似乎不是图像文件。"); } } /scrīpt
用iframe 里面加载的图片???
post不出去的 不用想了。
提示 不要用iframe容器,因为父级框架中 无法 提交子框架的 表单。 仅仅用原生的提交表单按钮 是绝对不可能的操作。
如果可以 改用div容器。显示预览,然后 提交原父级表单中的input type="file" 可以post传递文件。 iframe下的表单 仅仅用原生的 提交表单按钮 你post不出去
如果又能力自己重写提交动作,重组post数据(jq很简单实现这个)。也可以提交iframe下的子表单的input数据。
以下是我用的 简单的带图片预览上传的 部分代码
引用以下库
ajaxfileupload.js
jquery-migrate-1.2.1.min.js
jquery-1.11.0.min.js
$('input#but_upload').click(function(){
//picdata=$('input#picfile').val;
tc = $('div#tags').children('span.selecttag').eq(0).attr('mete_id');
tout = $('div#infos').children('div#sel_mod').find('li.selected').last().attr('mete_hash_name');
if (typeof(tc) == 'undefined'){
$('p#outerdebug').text('请选择一个标签');
return false;
}
if (typeof(tout) == 'undefined'){
$('p#outerdebug').text('请选择上传图片所在的模板框架');
return false;
}
if ($("#picfile").val().length = 0) {
$('p#outerdebug').text('请选择一个要上传的本地文件');
return false;
}
$.ajaxFileUpload({
url: "postpic.php?token=" + token +"tags=" + tc+"hash_name=" + tout,
secureuri:false,
type: 'post',
fileElementId: 'picfile',
dataType: 'json',
success: function(data,status){
if (data.success == true){
tempstr = "div class=\"pics\" mete_hash=\"" + data.hash_name + "\"div class=\"prepic\"img src=\"" + data.url + "\"/divdiv class=\"act\"div class=\"removethis\" onclick=\"removethis(this)\"/divdiv class=\"reflink\" onclick=\"reflink(this)\"/div/div/div";
$("div#previews").prepend(tempstr);
} else {
$('p#outerdebug').text(data.error);
}
},
error: function (data, status, e)//服务器响应失败处理函数
{
$('p#outerdebug').text('BR_0'+e);
}
});
})
HTML
forminput id="picfile" name="picfile" type="file" size="2000000"/br /input id="but_upload" type="button" value="上传" /hr //formp id="outerdebug"/pdiv id="previews"hr style=" clear:both; visibility:hidden;"/
顺带一提的是,这个实现异步提交上传文件的js库,实际上就是利用了iframe,在iframe子框架内提前实现了一次post。
另外,从用户端执行效果出发。不建议用iframe。 iframe加载是使用的主线程句柄。如果iframe页面响应时间过长。会导致全部页面,包括父级页面锁死。用户体验较差。 能用ajax异步,尽量用。 我还没遇到过ajax加载 输入到div容器,用户体验感反而比iframe差的情况。
A.PHP
form id="form1" name="form1" method="post" action="B.PHP"
input name="txt" type="text" id="txt" /
input type="submit" name="Submit" value="预览" /
/form
B.PHP
form id="form1" name="form1" method="post" action="提交数据处理的页面"
页面A的内容:?=$_POST["txt"]?
input name="txt" type="hidden" id="txt" value="?=$_POST["txt"]?" /
br /
input type="submit" name="Submit" value="提交" /
input type="button" name="Submit2" value="返回" onclick="history.go(-1)" /
/form