Chinaunix首页 | 论坛 | 博客
  • 博客访问: 314268
  • 博文数量: 111
  • 博客积分: 0
  • 博客等级: 民兵
  • 技术积分: 707
  • 用 户 组: 普通用户
  • 注册时间: 2013-02-26 11:00
个人简介

小伙向前冲呀,小伙向前冲呀。

文章分类

全部博文(111)

文章存档

2014年(43)

2013年(68)

我的朋友

分类: JavaScript

2013-10-22 05:52:58

最近做的一个小功能,需要清空的值,但上传控件的值不能通过JavaScript来修改。

google找到这样一个解决方法: 
在上传控件中插入了值,就只能通过form的reset功能来清空了,但是form里面其他的值也被reset了。 
既然可以使用form的reset清空,那就有办法了:新建一个临时form,然后将需要清空的上传控件移入其中,reset之后,再移回原来所在位置,最后删除创建的临时form。js代码: 

  1. var Upload = {
  2. clear: function(id){
  3. var up = (typeof id=="string")?document.getElementById(id):id;
  4. if (typeof up != "object") return null;
  5. var tt = document.createElement("span");
  6. tt.id = "__tt__";
  7. up.parentNode.insertBefore(tt,up);
  8. var tf = document.createElement("form");
  9. tf.appendChild(up);
  10. document.getElementsByTagName("body")[0].appendChild(tf);
  11. tf.reset();
  12. tt.parentNode.insertBefore(up,tt);
  13. tt.parentNode.removeChild(tt);
  14. tt = null;
  15. tf.parentNode.removeChild(tf);
  16. },
  17. clearForm: function(){
  18. var inputs,frm;
  19. if (arguments.length == 0)
  20. {
  21. inputs = document.getElementsByTagName("input");
  22. }else{
  23. frm = (typeof arguments[0] == "string")?document.getElementById(arguments[0]):arguments[0];
  24. if (typeof frm != "object") return null;
  25. inputs = frm.getElementsByTagName("input");
  26. }
  27. var fs=[];
  28. for ( var i=0; i<inputs.length; i++ )
  29. {
  30. if (inputs[i].type == "file") fs[fs.length] = inputs[i];
  31. }
  32. var tf = document.createElement("form");
  33. for ( var i=0; i<fs.length; i++ )
  34. {
  35. var tt = document.createElement("span");
  36. tt.id = "__tt__" + i;
  37. fs[i].parentNode.insertBefore(tt, fs[i]);
  38. tf.appendChild(fs[i]);
  39. }
  40. document.getElementsByTagName("body")[0].appendChild(tf);
  41. tf.reset();
  42. for ( var i=0; i<fs.length; i++)
  43. {
  44. var tt = document.getElementById("__tt__" + i);
  45. tt.parentNode.insertBefore(fs[i],tt);
  46. tt.parentNode.removeChild(tt);
  47. }
  48. tf.parentNode.removeChild(tf);
  49. }
  50. }
  51. view plaincopy to clipboardprint?
  52. var Upload = {
  53. clear: function(id){
  54. var up = (typeof id=="string")?document.getElementById(id):id;
  55. if (typeof up != "object") return null;
  56. var tt = document.createElement("span");
  57. tt.id = "__tt__";
  58. up.parentNode.insertBefore(tt,up);
  59. var tf = document.createElement("form");
  60. tf.appendChild(up);
  61. document.getElementsByTagName("body")[0].appendChild(tf);
  62. tf.reset();
  63. tt.parentNode.insertBefore(up,tt);
  64. tt.parentNode.removeChild(tt);
  65. tt = null;
  66. tf.parentNode.removeChild(tf);
  67. },
  68. clearForm: function(){
  69. var inputs,frm;
  70. if (arguments.length == 0)
  71. {
  72. inputs = document.getElementsByTagName("input");
  73. }else{
  74. frm = (typeof arguments[0] == "string")?document.getElementById(arguments[0]):arguments[0];
  75. if (typeof frm != "object") return null;
  76. inputs = frm.getElementsByTagName("input");
  77. }
  78. var fs=[];
  79. for ( var i=0; i<inputs.length; i++ )
  80. {
  81. if (inputs[i].type == "file") fs[fs.length] = inputs[i];
  82. }
  83. var tf = document.createElement("form");
  84. for ( var i=0; i<fs.length; i++ )
  85. {
  86. var tt = document.createElement("span");
  87. tt.id = "__tt__" + i;
  88. fs[i].parentNode.insertBefore(tt, fs[i]);
  89. tf.appendChild(fs[i]);
  90. }
  91. document.getElementsByTagName("body")[0].appendChild(tf);
  92. tf.reset();
  93. for ( var i=0; i<fs.length; i++)
  94. {
  95. var tt = document.getElementById("__tt__" + i);
  96. tt.parentNode.insertBefore(fs[i],tt);
  97. tt.parentNode.removeChild(tt);
  98. }
  99. tf.parentNode.removeChild(tf);
  100. }
  101. }
  102. var Upload = {
  103. clear: function(id){
  104. var up = (typeof id=="string")?document.getElementById(id):id;
  105. if (typeof up != "object") return null;
  106. var tt = document.createElement("span");
  107. tt.id = "__tt__";
  108. up.parentNode.insertBefore(tt,up);
  109. var tf = document.createElement("form");
  110. tf.appendChild(up);
  111. document.getElementsByTagName("body")[0].appendChild(tf);
  112. tf.reset();
  113. tt.parentNode.insertBefore(up,tt);
  114. tt.parentNode.removeChild(tt);
  115. tt = null;
  116. tf.parentNode.removeChild(tf);
  117. },
  118. clearForm: function(){
  119. var inputs,frm;
  120. if (arguments.length == 0)
  121. {
  122. inputs = document.getElementsByTagName("input");
  123. }else{
  124. frm = (typeof arguments[0] == "string")?document.getElementById(arguments[0]):arguments[0];
  125. if (typeof frm != "object") return null;
  126. inputs = frm.getElementsByTagName("input");
  127. }
  128. var fs=[];
  129. for ( var i=0; i<inputs.length; i++ )
  130. {
  131. if (inputs[i].type == "file") fs[fs.length] = inputs[i];
  132. }
  133. var tf = document.createElement("form");
  134. for ( var i=0; i<fs.length; i++ )
  135. {
  136. var tt = document.createElement("span");
  137. tt.id = "__tt__" + i;
  138. fs[i].parentNode.insertBefore(tt, fs[i]);
  139. tf.appendChild(fs[i]);
  140. }
  141. document.getElementsByTagName("body")[0].appendChild(tf);
  142. tf.reset();
  143. for ( var i=0; i<fs.length; i++)
  144. {
  145. var tt = document.getElementById("__tt__" + i);
  146. tt.parentNode.insertBefore(fs[i],tt);
  147. tt.parentNode.removeChild(tt);
  148. }
  149. tf.parentNode.removeChild(tf);
  150. }
  151. }
使用示例: 

  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "">
  2. <html xmlns="">
  3. <head>
  4. <title>JS清空上传控件input(type="file")的值-www.jbxue.com</title>
  5. <script type="text/javascript">
  6. <!--引入以上js代码--></script>
  7. </head>
  8. <body>
  9. <form name="testform" method="post">
  10. <input type="file" name="testfile" />
  11. <input type="button" value="clear" onclick="Upload.clear('testfile')" /><br />
  12. <input type="button" value="clearAll" onclick="Upload.clearForm()" /><br />
  13. <input type="submit" value="submit" /><input type="reset" value="reset" />
  14. </form>
  15. </body>
  16. </html>
阅读(759) | 评论(0) | 转发(0) |
给主人留下些什么吧!~~