search
HomeBackend DevelopmentPHP TutorialJQ plug-in ajaxFileUpload, php to implement pictures, data uploaded at the same time, _PHP tutorial

JQ plug-in ajaxFileUpload and php implement images and data are uploaded at the same time.

The code structure is as follows:

1. HTML code, no need to explain.

<span> 1</span> <span><!</span><span>DOCTYPE html</span><span>></span>
<span> 2</span> <span><</span><span>html</span><span>></span>
<span> 3</span>     <span><</span><span>head</span><span>></span>
<span> 4</span>         <span><</span><span>meta </span><span>charset</span><span>="UTF-8"</span><span>></span>
<span> 5</span>         <span><</span><span>title</span><span>></span>文件上传<span></</span><span>title</span><span>></span>
<span> 6</span>         <span><</span><span>script </span><span>src</span><span>="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"</span><span>></</span><span>script</span><span>></span>
<span> 7</span>         <span><</span><span>script </span><span>src</span><span>="uploads/ajaxFileUpload.js"</span><span> type</span><span>="text/javascript"</span><span> charset</span><span>="utf-8"</span><span>></</span><span>script</span><span>></span>
<span> 8</span>         <span><</span><span>script </span><span>type</span><span>="text/javascript"</span><span>></span>
<span> 9</span> <span>            $(</span><span>function</span><span>(){
</span><span>10</span> <span>                $(</span><span>'</span><span>#ti</span><span>'</span><span>).click(</span><span>function</span><span>(){
</span><span>11</span>                     <span>var</span><span> data </span><span>=</span><span> { name: </span><span>'</span><span>my name</span><span>'</span><span>, description: </span><span>'</span><span>short description</span><span>'</span><span> } 
</span><span>12</span> <span>                    $.ajaxFileUpload({
</span><span>13</span> <span>                        url: </span><span>'</span><span>up.php</span><span>'</span><span>,
</span><span>14</span> <span>                        secureuri: </span><span>false</span><span>,
</span><span>15</span> <span>                        data: data,
</span><span>16</span> <span>                        fileElementId: </span><span>'</span><span>upf</span><span>'</span><span>,
</span><span>17</span> <span>                        dataType: </span><span>'</span><span>json</span><span>'</span><span>,
</span><span>18</span> <span>                        success: </span><span>function</span><span> (data) {
</span><span>19</span>                            <span>//</span><span> var datejson=eval(data);</span>
<span>20</span>                              <span>//</span><span>console.log(data[0].path_name)</span>
<span>21</span> <span>                         $(</span><span>'</span><span>#im</span><span>'</span><span>).append(</span><span>'</span><span><img  src="/static/imghwm/default1.png"  data-src="</span alt="JQ plug-in ajaxFileUpload, php to implement pictures, data uploaded at the same time, _PHP tutorial" ><span>'</span><span>+</span><span>data[</span><span>0</span><span>].path_name</span><span>+</span><span>'</span><span>"  class="lazy"</span><span>+</span><span>data[</span><span>0</span><span>].path_name</span><span>+</span><span>'</span><span>"></span><span>'</span><span>)    
</span><span>22</span>                              <span>//</span><span>console.log('<img  src="/static/imghwm/default1.png"  data-src="'+data[0].path_name+'"  class="lazy"+data[0].path_name+'" alt="JQ plug-in ajaxFileUpload, php to implement pictures, data uploaded at the same time, _PHP tutorial" >')</span>
<span>23</span> <span>                        },
</span><span>24</span> <span>                        error: </span><span>function</span><span> (data) {
</span><span>25</span> <span>                              console.log(data)
</span><span>26</span> <span>                        }
</span><span>27</span> <span>                    });
</span><span>28</span> 
<span>29</span> <span>                })
</span><span>30</span>                 
<span>31</span> <span>            })
</span><span>32</span>         <span></</span><span>script</span><span>></span>
<span>33</span>     <span></</span><span>head</span><span>></span>
<span>34</span>     <span><</span><span>body</span><span>></span>
<span>35</span>     <span><!--</span><span><form action="up.php" method="post" enctype="multipart/form-data">
</span><span>36</span> <span>    </form></span><span>--></span>
<span>37</span>         <span><</span><span>input  </span><span>type</span><span>="file"</span><span> name</span><span>="upfm"</span><span> id</span><span>="upf"</span><span> value</span><span>=""</span> <span>/></span>
<span>38</span>         <span><</span><span>input </span><span>id</span><span>='ti' </span><span>type</span><span>="button"</span><span> value</span><span>="提交"</span><span>/></span>
<span>39</span> 
<span>40</span>         <span><</span><span>div </span><span>id</span><span>="im"</span><span>></span>
<span>41</span>             
<span>42</span>         <span></</span><span>div</span><span>></span>
<span>43</span>         
<span>44</span>     <span></</span><span>body</span><span>></span>
<span>45</span> 
<span>46</span> <span></</span><span>html</span><span>></span>

2. Regarding the ajaxFileUpload plug-in, in the following code, if you are using JQ1.9 or above, please copy 1-12 to your ajaxFileUpload code. JQ abandoned the handleError method very early. Comments explain the code very clearly.

<span>  1</span> <span>jQuery.extend({
</span><span>  2</span>     handleError: <span>function</span><span>( s, xhr, status, e )         {
</span><span>  3</span>         
<span>  4</span>                 <span>if</span><span> ( s.error ) {
</span><span>  5</span>                     s.error.call( s.context ||<span> s, xhr, status, e );
</span><span>  6</span> <span>                }
</span><span>  7</span> 
<span>  8</span>                 
<span>  9</span>                 <span>if</span><span> ( s.global ) {
</span><span> 10</span>                     (s.context ? jQuery(s.context) : jQuery.event).trigger( "ajaxError"<span>, [xhr, s, e] );
</span><span> 11</span> <span>                }
</span><span> 12</span> <span>   },
</span><span> 13</span>     createUploadIframe: <span>function</span> (id, uri) {<span>//</span><span>id为当前系统时间字符串,uri是外部传入的json对象的一个参数</span>
<span> 14</span>         <span>//</span><span>create frame</span>
<span> 15</span>         <span>var</span> frameId = 'jUploadFrame' + id; <span>//</span><span>给iframe添加一个独一无二的id</span>
<span> 16</span>         <span>var</span> iframeHtml = '<iframe id="' + frameId + '" name="' + frameId + '">//</span><span>创建iframe元素</span>
<span> 17</span>         <span>if</span> (window.ActiveXObject) {<span>//</span><span>判断浏览器是否支持ActiveX控件</span>
<span> 18</span>             <span>if</span> (<span>typeof</span> uri == 'boolean'<span>) {
</span><span> 19</span>                 iframeHtml += ' src="' + 'javascript:false' + '"'<span>;
</span><span> 20</span>             }            <span>else</span> <span>if</span> (<span>typeof</span> uri == 'string'<span>) {
</span><span> 21</span>                 iframeHtml += ' src="' + uri + '"'<span>;
</span><span> 22</span> <span>            }
</span><span> 23</span> <span>        }
</span><span> 24</span>         iframeHtml += ' />'<span>;
</span><span> 25</span>         jQuery(iframeHtml).appendTo(document.body); <span>//</span><span>将动态iframe追加到body中</span>
<span> 26</span>         <span>return</span> jQuery('#' + frameId).get(0); <span>//</span><span>返回iframe对象</span>
<span> 27</span> <span>    },
</span><span> 28</span>     createUploadForm: <span>function</span> (id, fileElementId, data) {<span>//</span><span>id为当前系统时间字符串,fileElementId为页面<input type='file' />的id,data的值需要根据传入json的键来决定</span>
<span> 29</span>         <span>//</span><span>create form    </span>
<span> 30</span>         <span>var</span> formId = 'jUploadForm' + id; <span>//</span><span>给form添加一个独一无二的id</span>
<span> 31</span>         <span>var</span> fileId = 'jUploadFile' + id; <span>//</span><span>给<input type='file' />添加一个独一无二的id</span>
<span> 32</span>         <span>var</span> form = jQuery('<form  action="" method="POST" name="' + formId + '" id="' + formId + '" enctype="multipart/form-data" ></form>'); <span>//</span><span>创建form元素</span>
<span> 33</span>         <span>if</span> (data) {<span>//</span><span>通常为false</span>
<span> 34</span>             <span>for</span> (<span>var</span> i <span>in</span><span> data) {
</span><span> 35</span>                 jQuery('<input type="hidden" name="' + i + '" value="' + data[i] + '" />').appendTo(form); <span>//</span><span>根据data的内容,创建隐藏域,这部分我还不知道是什么时候用到。估计是传入json的时候,如果默认传一些参数的话要用到。</span>
<span> 36</span> <span>            }
</span><span> 37</span>         }        <span>var</span> oldElement = jQuery('#' + fileElementId); <span>//</span><span>得到页面中的<input type='file' />对象</span>
<span> 38</span>         <span>var</span> newElement = jQuery(oldElement).clone(); <span>//</span><span>克隆页面中的<input type='file' />对象</span>
<span> 39</span>         jQuery(oldElement).attr('id', fileId); <span>//</span><span>修改原对象的id</span>
<span> 40</span>         jQuery(oldElement).before(newElement); <span>//</span><span>在原对象前插入克隆对象</span>
<span> 41</span>         jQuery(oldElement).appendTo(form); <span>//</span><span>把原对象插入到动态form的结尾处</span>
<span> 42</span>         <span>//</span><span>set attributes</span>
<span> 43</span>         jQuery(form).css('position', 'absolute'); <span>//</span><span>给动态form添加样式,使其浮动起来,</span>
<span> 44</span>         jQuery(form).css('top', '-1200px'<span>);
</span><span> 45</span>         jQuery(form).css('left', '-1200px'<span>);
</span><span> 46</span>         jQuery(form).appendTo('body'); <span>//</span><span>把动态form插入到body中</span>
<span> 47</span>         <span>return</span><span> form;
</span><span> 48</span> <span>    },
</span><span> 49</span>     ajaxFileUpload: <span>function</span> (s) {<span>//</span><span>这里s是个json对象,传入一些ajax的参数</span>
<span> 50</span>         <span>//</span><span> TODO introduce global settings, allowing the client to modify them for all requests, not only timeout        </span>
<span> 51</span>         s = jQuery.extend({}, jQuery.ajaxSettings, s); <span>//</span><span>此时的s对象是由jQuery.ajaxSettings和原s对象扩展后的对象</span>
<span> 52</span>         <span>var</span> id = <span>new</span> Date().getTime(); <span>//</span><span>取当前系统时间,目的是得到一个独一无二的数字</span>
<span> 53</span>         <span>var</span> form = jQuery.createUploadForm(id, s.fileElementId, (<span>typeof</span> (s.data) == 'undefined' ? <span>false</span> : s.data)); <span>//</span><span>创建动态form</span>
<span> 54</span>         <span>var</span> io = jQuery.createUploadIframe(id, s.secureuri); <span>//</span><span>创建动态iframe</span>
<span> 55</span>         <span>var</span> frameId = 'jUploadFrame' + id; <span>//</span><span>动态iframe的id</span>
<span> 56</span>         <span>var</span> formId = 'jUploadForm' + id; <span>//</span><span>动态form的id</span>
<span> 57</span>         <span>//</span><span> Watch for a new set of requests</span>
<span> 58</span>         <span>if</span> (s.global && !jQuery.active++) {<span>//</span><span>当jQuery开始一个ajax请求时发生</span>
<span> 59</span>             jQuery.event.trigger("ajaxStart"); <span>//</span><span>触发ajaxStart方法</span>
<span> 60</span>         }        <span>var</span> requestDone = <span>false</span>; <span>//</span><span>请求完成标志</span>
<span> 61</span>         <span>//</span><span> Create the request object</span>
<span> 62</span>         <span>var</span> xml = {};        <span>if</span><span> (s.global)
</span><span> 63</span>             jQuery.event.trigger("ajaxSend", [xml, s]); <span>//</span><span>触发ajaxSend方法</span>
<span> 64</span>         <span>//</span><span> Wait for a response to come back</span>
<span> 65</span>         <span>var</span> uploadCallback = <span>function</span> (isTimeout) {<span>//</span><span>回调函数</span>
<span> 66</span>             <span>var</span> io = document.getElementById(frameId); <span>//</span><span>得到iframe对象</span>
<span> 67</span>             <span>try</span> {                <span>if</span> (io.contentWindow) {<span>//</span><span>动态iframe所在窗口对象是否存在</span>
<span> 68</span>                     xml.responseText = io.contentWindow.document.body ? io.contentWindow.document.body.innerHTML : <span>null</span><span>;
</span><span> 69</span>                     xml.responseXML = io.contentWindow.document.XMLDocument ?<span> io.contentWindow.document.XMLDocument : io.contentWindow.document;
</span><span> 70</span>                 } <span>else</span> <span>if</span> (io.contentDocument) {<span>//</span><span>动态iframe的文档对象是否存在</span>
<span> 71</span>                     xml.responseText = io.contentDocument.document.body ? io.contentDocument.document.body.innerHTML : <span>null</span><span>;
</span><span> 72</span>                     xml.responseXML = io.contentDocument.document.XMLDocument ?<span> io.contentDocument.document.XMLDocument : io.contentDocument.document;
</span><span> 73</span> <span>                }
</span><span> 74</span>             } <span>catch</span><span> (e) {
</span><span> 75</span>                 jQuery.handleError(s, xml, <span>null</span><span>, e);
</span><span> 76</span>             }            <span>if</span> (xml || isTimeout == "timeout") {<span>//</span><span>xml变量被赋值或者isTimeout == "timeout"都表示请求发出,并且有响应</span>
<span> 77</span>                 requestDone = <span>true</span>; <span>//</span><span>请求完成</span>
<span> 78</span>                 <span>var</span> status;                <span>try</span><span> {
</span><span> 79</span>                     status = isTimeout != "timeout" ? "success" : "error"; <span>//</span><span>如果不是&ldquo;超时&rdquo;,表示请求成功</span>
<span> 80</span>                     <span>//</span><span> Make sure that the request was successful or notmodified</span>
<span> 81</span>                     <span>if</span> (status != "error") {                        <span>//</span><span> process the data (runs the xml through httpData regardless of callback)</span>
<span> 82</span>                         <span>var</span> data = jQuery.uploadHttpData(xml, s.dataType); <span>//</span><span>根据传送的type类型,返回json对象,此时返回的data就是后台操作后的返回结果</span>
<span> 83</span>                         <span>//</span><span> If a local callback was specified, fire it and pass it the data</span>
<span> 84</span>                         <span>if</span><span> (s.success)
</span><span> 85</span>                             s.success(data, status); <span>//</span><span>执行上传成功的操作</span>
<span> 86</span>                         <span>//</span><span> Fire the global callback</span>
<span> 87</span>                         <span>if</span><span> (s.global)
</span><span> 88</span>                             jQuery.event.trigger("ajaxSuccess"<span>, [xml, s]);
</span><span> 89</span>                     } <span>else</span>
<span> 90</span> <span>                        jQuery.handleError(s, xml, status);
</span><span> 91</span>                 } <span>catch</span><span> (e) {
</span><span> 92</span>                     status = "error"<span>;
</span><span> 93</span> <span>                    jQuery.handleError(s, xml, status, e);
</span><span> 94</span>                 }                <span>//</span><span> The request was completed</span>
<span> 95</span>                 <span>if</span><span> (s.global)
</span><span> 96</span>                     jQuery.event.trigger("ajaxComplete", [xml, s]);                <span>//</span><span> Handle the global AJAX counter</span>
<span> 97</span>                 <span>if</span> (s.global && ! --<span>jQuery.active)
</span><span> 98</span>                     jQuery.event.trigger("ajaxStop");                <span>//</span><span> Process result</span>
<span> 99</span>                 <span>if</span><span> (s.complete)
</span><span>100</span> <span>                    s.complete(xml, status);
</span><span>101</span>                 jQuery(io).unbind();<span>//</span><span>移除iframe的事件处理程序</span>
<span>102</span>                 setTimeout(<span>function</span> () {<span>//</span><span>设置超时时间</span>
<span>103</span>                     <span>try</span><span> {
</span><span>104</span>                         jQuery(io).remove();<span>//</span><span>移除动态iframe</span>
<span>105</span>                         jQuery(form).remove();<span>//</span><span>移除动态form</span>
<span>106</span>                     } <span>catch</span><span> (e) {
</span><span>107</span>                         jQuery.handleError(s, xml, <span>null</span><span>, e);
</span><span>108</span> <span>                    }
</span><span>109</span>                 }, 100<span>)
</span><span>110</span>                 xml = <span>null</span>
<span>111</span> <span>            }
</span><span>112</span>         }        <span>//</span><span> Timeout checker</span>
<span>113</span>         <span>if</span> (s.timeout > 0) {<span>//</span><span>超时检测</span>
<span>114</span>             setTimeout(<span>function</span> () {                <span>//</span><span> Check to see if the request is still happening</span>
<span>115</span>                 <span>if</span> (!requestDone) uploadCallback("timeout");<span>//</span><span>如果请求仍未完成,就发送超时信号</span>
<span>116</span> <span>            }, s.timeout);
</span><span>117</span>         }        <span>try</span> {            <span>var</span> form = jQuery('#' +<span> formId);
</span><span>118</span>             jQuery(form).attr('action', s.url);<span>//</span><span>传入的ajax页面导向url</span>
<span>119</span>             jQuery(form).attr('method', 'POST');<span>//</span><span>设置提交表单方式</span>
<span>120</span>             jQuery(form).attr('target', frameId);<span>//</span><span>返回的目标iframe,就是创建的动态iframe</span>
<span>121</span>             <span>if</span> (form.encoding) {<span>//</span><span>选择编码方式</span>
<span>122</span>                 jQuery(form).attr('encoding', 'multipart/form-data'<span>);
</span><span>123</span>             }            <span>else</span><span> {
</span><span>124</span>                 jQuery(form).attr('enctype', 'multipart/form-data'<span>);
</span><span>125</span> <span>            }
</span><span>126</span>             jQuery(form).submit();<span>//</span><span>提交form表单</span>
<span>127</span>         } <span>catch</span><span> (e) {
</span><span>128</span>             jQuery.handleError(s, xml, <span>null</span><span>, e);
</span><span>129</span> <span>        }
</span><span>130</span>         jQuery('#' + frameId).load(uploadCallback); <span>//</span><span>ajax 请求从服务器加载数据,同时传入回调函数</span>
<span>131</span>         <span>return</span> { abort: <span>function</span><span> () { } };
</span><span>132</span> <span>    },
</span><span>133</span>     uploadHttpData: <span>function</span> (r, type) {        <span>var</span> data = !<span>type;
</span><span>134</span>         data = type == "xml" || data ? r.responseXML : r.responseText;        <span>//</span><span> If the type is "script", eval it in global context</span>
<span>135</span>         <span>if</span> (type == "script"<span>)
</span><span>136</span>             jQuery.globalEval(data);        <span>//</span><span> Get the JavaScript object, if JSON is used.</span>
<span>137</span>         <span>if</span> (type == "json"<span>)
</span><span>138</span>             eval("data = " + data);        <span>//</span><span> evaluate scripts within html</span>
<span>139</span>         <span>if</span> (type == "html"<span>)
</span><span>140</span>             jQuery("<div>").html(data).evalScripts();        <span>return</span><span> data;
</span><span>141</span> <span>    }
</span><span>142</span> })

3. php code

<span>  1</span> <?<span>php
</span><span>  2</span>     <span>//</span><span>print_r($_FILES);
</span><span>  3</span> <span>//echo json_encode(print_r($_FILES));</span>
<span>  4</span> 
<span>  5</span> <span>/*</span><span>*
</span><span>  6</span> <span> * 生成唯一字符串
</span><span>  7</span> <span> * @return string
</span><span>  8</span>  <span>*/</span>
<span>  9</span> <span>function</span><span> getUniName(){
</span><span> 10</span>     <span>return</span> <span>md5</span>(<span>uniqid</span>(<span>microtime</span>(<span>true</span>),<span>true</span><span>));
</span><span> 11</span> <span>}
</span><span> 12</span> 
<span> 13</span> <span>/*</span><span>*
</span><span> 14</span> <span> * 得到文件的扩展名
</span><span> 15</span> <span> * @param string $filename
</span><span> 16</span> <span> * @return string
</span><span> 17</span>  <span>*/</span>
<span> 18</span> <span>function</span> getExt(<span>$filename</span><span>){
</span><span> 19</span>     <span>return</span> <span>strtolower</span>(<span>end</span>(<span>explode</span>(".",<span>$filename</span><span>)));
</span><span> 20</span> <span>}
</span><span> 21</span> 
<span> 22</span> <span>/*</span><span>*
</span><span> 23</span> <span> * 构建上传文件信息
</span><span> 24</span> <span> * @return array
</span><span> 25</span>  <span>*/</span>
<span> 26</span> 
<span> 27</span> <span>function</span><span> buildInfo(){
</span><span> 28</span>     <span>if</span>(!<span>$_FILES</span><span>){
</span><span> 29</span>         <span>return</span><span> ;
</span><span> 30</span> <span>    }
</span><span> 31</span>     <span>$i</span>=0<span>;
</span><span> 32</span>     <span>foreach</span>(<span>$_FILES</span> <span>as</span> <span>$v</span><span>){
</span><span> 33</span>         <span>//</span><span>单文件</span>
<span> 34</span>         <span>if</span>(<span>is_string</span>(<span>$v</span>['name'<span>])){
</span><span> 35</span>             <span>$files</span>[<span>$i</span>]=<span>$v</span><span>;
</span><span> 36</span>             <span>$i</span>++<span>;
</span><span> 37</span>         }<span>else</span><span>{
</span><span> 38</span>             <span>//</span><span>多文件</span>
<span> 39</span>             <span>foreach</span>(<span>$v</span>['name'] <span>as</span> <span>$key</span>=><span>$val</span><span>){
</span><span> 40</span>                 <span>$files</span>[<span>$i</span>]['name']=<span>$val</span><span>;
</span><span> 41</span>                 <span>$files</span>[<span>$i</span>]['size']=<span>$v</span>['size'][<span>$key</span><span>];
</span><span> 42</span>                 <span>$files</span>[<span>$i</span>]['tmp_name']=<span>$v</span>['tmp_name'][<span>$key</span><span>];
</span><span> 43</span>                 <span>$files</span>[<span>$i</span>]['error']=<span>$v</span>['error'][<span>$key</span><span>];
</span><span> 44</span>                 <span>$files</span>[<span>$i</span>]['type']=<span>$v</span>['type'][<span>$key</span><span>];
</span><span> 45</span>                 <span>$i</span>++<span>;
</span><span> 46</span> <span>            }
</span><span> 47</span> <span>        }
</span><span> 48</span> <span>    }
</span><span> 49</span>     <span>return</span> <span>$files</span><span>;
</span><span> 50</span> <span>}
</span><span> 51</span> <span>function</span> uploadFile(<span>$path</span>="uploads",<span>$allowExt</span>=<span>array</span>("gif","jpeg","png","jpg","wbmp"),<span>$maxSize</span>=2097152,<span>$imgFlag</span>=<span>true</span><span>){
</span><span> 52</span>     <span>if</span>(!<span>file_exists</span>(<span>$path</span>)){<span>//</span><span>判断是否有$path文件夹,没有则创建</span>
<span> 53</span>         <span>mkdir</span>(<span>$path</span>,0777,<span>true</span>);<span>//</span><span>0777表示最大权限</span>
<span> 54</span> <span>    }
</span><span> 55</span>     <span>$i</span>=0<span>;
</span><span> 56</span>     <span>$files</span>=<span>buildInfo();
</span><span> 57</span>     <span>if</span>(!(<span>$files</span>&&<span>is_array</span>(<span>$files</span><span>))){
</span><span> 58</span>         <span>return</span><span> ;
</span><span> 59</span> <span>    }
</span><span> 60</span>     <span>foreach</span>(<span>$files</span> <span>as</span> <span>$file</span><span>){
</span><span> 61</span>         <span>if</span>(<span>$file</span>['error']===UPLOAD_ERR_OK){<span>//</span><span>就是0</span>
<span> 62</span>             <span>$ext</span>=getExt(<span>$file</span>['name'<span>]);
</span><span> 63</span>             <span>//</span><span>检测文件的扩展名</span>
<span> 64</span>             <span>if</span>(!<span>in_array</span>(<span>$ext</span>,<span>$allowExt</span><span>)){
</span><span> 65</span>                 <span>exit</span>("非法文件类型"<span>);
</span><span> 66</span> <span>            }
</span><span> 67</span>             <span>//</span><span>校验是否是一个真正的图片类型</span>
<span> 68</span>             <span>if</span>(<span>$imgFlag</span><span>){
</span><span> 69</span>                 <span>if</span>(!<span>getimagesize</span>(<span>$file</span>['tmp_name'<span>])){
</span><span> 70</span>                     <span>exit</span>("不是真正的图片类型"<span>);
</span><span> 71</span>                     
<span> 72</span>                 }<span>else</span><span>{
</span><span> 73</span>                     <span>$file</span>["filesize"]=<span>getimagesize</span>(<span>$file</span>['tmp_name'<span>]);
</span><span> 74</span>                     <span>//</span><span>把文件信息付给$file 传到前台返回时数组
</span><span> 75</span> <span>                    //如 [720, 1280, 2, "width="720" height="1280"", 8, 3, "image/jpeg"]</span>
<span> 76</span> <span>                }
</span><span> 77</span> <span>            }
</span><span> 78</span>             <span>//</span><span>上传文件的大小</span>
<span> 79</span>             <span>if</span>(<span>$file</span>['size']><span>$maxSize</span><span>){
</span><span> 80</span>                 <span>exit</span>("上传文件过大"<span>);
</span><span> 81</span> <span>            }
</span><span> 82</span>             <span>if</span>(!<span>is_uploaded_file</span>(<span>$file</span>['tmp_name'<span>])){
</span><span> 83</span>                 <span>exit</span>("不是通过HTTP POST方式上传上来的"<span>);
</span><span> 84</span> <span>            }
</span><span> 85</span>             <span>$filename</span>=getUniName().".".<span>$ext</span>;<span>//</span><span>改文件重新命名</span>
<span> 86</span>             <span>$destination</span>=<span>$path</span>."/".<span>$filename</span><span>;
</span><span> 87</span>             <span>if</span>(<span>move_uploaded_file</span>(<span>$file</span>['tmp_name'], <span>$destination</span><span>)){
</span><span> 88</span>                 <span>$file</span>['name']=<span>$filename</span><span>;
</span><span> 89</span>                 <span>$file</span>['path_name']=<span>$destination</span><span>;
</span><span> 90</span>                 <span>unset</span>(<span>$file</span>['tmp_name'],<span>$file</span>['size'],<span>$file</span>['type']);<span>//</span><span>去除不需要传给的信息</span>
<span> 91</span>                 <span>$uploadedFiles</span>[<span>$i</span>]=<span>$file</span><span>;
</span><span> 92</span>                 <span>$i</span>++<span>;
</span><span> 93</span> <span>            }
</span><span> 94</span>         }<span>else</span><span>{
</span><span> 95</span>             <span>switch</span>(<span>$file</span>['error'<span>]){
</span><span> 96</span>                     <span>case</span> 1:
<span> 97</span>                         <span>$mes</span>="超过了配置文件上传文件的大小";<span>//</span><span>UPLOAD_ERR_INI_SIZE</span>
<span> 98</span>                         <span>break</span><span>;
</span><span> 99</span>                     <span>case</span> 2:
<span>100</span>                         <span>$mes</span>="超过了表单设置上传文件的大小";            <span>//</span><span>UPLOAD_ERR_FORM_SIZE</span>
<span>101</span>                         <span>break</span><span>;
</span><span>102</span>                     <span>case</span> 3:
<span>103</span>                         <span>$mes</span>="文件部分被上传";<span>//</span><span>UPLOAD_ERR_PARTIAL</span>
<span>104</span>                         <span>break</span><span>;
</span><span>105</span>                     <span>case</span> 4:
<span>106</span>                         <span>$mes</span>="没有文件被上传1111";<span>//</span><span>UPLOAD_ERR_NO_FILE</span>
<span>107</span>                         <span>break</span><span>;
</span><span>108</span>                     <span>case</span> 6:
<span>109</span>                         <span>$mes</span>="没有找到临时目录";<span>//</span><span>UPLOAD_ERR_NO_TMP_DIR</span>
<span>110</span>                         <span>break</span><span>;
</span><span>111</span>                     <span>case</span> 7:
<span>112</span>                         <span>$mes</span>="文件不可写";<span>//</span><span>UPLOAD_ERR_CANT_WRITE;</span>
<span>113</span>                         <span>break</span><span>;
</span><span>114</span>                     <span>case</span> 8:
<span>115</span>                         <span>$mes</span>="由于PHP的扩展程序中断了文件上传";<span>//</span><span>UPLOAD_ERR_EXTENSION</span>
<span>116</span>                         <span>break</span><span>;
</span><span>117</span> <span>                }
</span><span>118</span>                 <span>echo</span> <span>$mes</span><span>;
</span><span>119</span> <span>            }
</span><span>120</span> <span>    }
</span><span>121</span>     <span>return</span> <span>$uploadedFiles</span><span>;
</span><span>122</span> <span>};
</span><span>123</span> 
<span>124</span> <span>$rows</span>=uploadFile(<span>$path</span>="uploads",<span>$allowExt</span>=<span>array</span>("gif","jpeg","png","jpg","wbmp"),<span>$maxSize</span>=2097152,<span>$imgFlag</span>=<span>true</span><span>);
</span><span>125</span> 
<span>126</span> <span>echo</span> json_encode(<span>$rows</span>);

uploadFile($path="uploads",$allowExt=array("gif","jpeg","png","jpg","wbmp"), $maxSize=2097152,$imgFlag=true);

This php code can be changed to allow uploading other files and size limits. getimagesize is used to determine whether the suffix is ​​changed for a virus file.

Copy the above code directly to complete the simultaneous upload of images and user data.

Return result: [{"name":"d032a4ee7e957d956c8af0039d7e3085.jpg","error":0,"filesiz":{"0":720,"1":1280,"2":2,"3" :"width="720" height="1280"","bits":8,"channels":3,"mime":"image/jpeg"},"path_name":"uploads/d032a4ee7e957d956c8af0039d7e3085.jpg"}]

www.bkjia.comtruehttp: //www.bkjia.com/PHPjc/1117667.htmlTechArticleJQ plug-in ajaxFileUpload and php implement images and data are uploaded at the same time. The code structure is as follows: 1. HTML code, no need to explain . 1 ! DOCTYPE html 2 html 3 head 4 meta charset ="UTF-8"...
Statement
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
五个IntelliJ IDEA插件,高效编写代码五个IntelliJ IDEA插件,高效编写代码Jul 16, 2023 am 08:03 AM

人工智能AI是当前广受认可的未来趋势和发展方向。虽然有些人担心AI可能会取代所有的工作,但实际上只会取代那些重复性高、产出低的工作。因此,我们应该学会更加聪明地工作,而不是使劲努力地工作。本文介绍5个由AI驱动的Intellij插件,这些插件可以帮助你提高生产力,减少繁琐的重复性工作,让你的工作更加高效、便捷。1GithubCopilotGithubCopilot是由OpenAI和GitHub联合开发的一款人工智能代码辅助工具。它使用了OpenAI的GPT模型来分析代码上下文,预测并生成新的代码

atom中 40+ 个常用插件推荐分享(附插件安装方法)atom中 40+ 个常用插件推荐分享(附插件安装方法)Dec 20, 2021 pm 04:14 PM

本篇文章给大家分享40+ 个atom常用插件,并附上在atom中安装插件的方法,希望对大家有所帮助!

vscode插件分享: 6个Vue3开发必备插件vscode插件分享: 6个Vue3开发必备插件Dec 09, 2022 pm 08:36 PM

本篇文章给大家整理分享 6 个 Vue3 开发必备的 VSCode 插件,可以直接用过 VSCode 的插件中心直接安装使用,希望对大家有所帮助!

2023年最新最全的VScode插件推荐2023年最新最全的VScode插件推荐Jan 24, 2023 am 05:30 AM

这篇文章主要介绍了这么多年来我在使用 VSCode 过程中用到的一些不错的插件。这些VSCode插件,帮你打造地表最强IDE!

用 VSCode 写 Python,这14个插件不容错过!用 VSCode 写 Python,这14个插件不容错过!May 24, 2023 pm 05:19 PM

可以说,VisualStudioCode这个编辑器,让微软在开源社区赢回了王者段位,要知道全球2400万开发者中有1400万称VSCode为自己的家,再加上GitHub和VSCode的结合,几乎所有的程序员的都离不开VSCode,不过,VSCode如此优秀,值得每个程序员使用,甚至我觉得非程序员都可以用它来码字。如果你还没用过VSCode,那访问这里安装[1]一个吧,很可能就打开了一个新世界。今天分享14个非常实用VSCode插件,可以让你写代码如同神一般,尤其是

【吐血总结】23个VSCode 插件,助你提高开发效率和美观性【吐血总结】23个VSCode 插件,助你提高开发效率和美观性Mar 10, 2022 pm 08:01 PM

本篇文章给大家总结了23个各种功能的VSCode 插件,可以帮助开发者提高开发效率和美观性,希望对大家有所帮助!

canvas插件有哪些canvas插件有哪些Aug 17, 2023 pm 05:00 PM

canvas插件有Fabric.js、EaselJS、Konva.js、Three.js、Paper.js、Chart.js和Phaser。详细介绍:1、Fabric.js 是一个基于Canvas的开源 JavaScript 库,它提供了一些强大的功能;2、EaselJS是CreateJS库中的一个模块,它提供了一套简化了Canvas编程的API;3、Konva.js等等。

如虎添翼,六个让你效率翻倍的ChatGPT插件如虎添翼,六个让你效率翻倍的ChatGPT插件May 17, 2023 pm 02:28 PM

ChatGPT是一个超强的AI应用程序,OpenAI已经发布的GPT-4引起了更广泛的关注。ChatGPT是由OpenAI开发的专门从事对话的AI聊天机器人,其主要目标是使AI系统更自然地进行互动。大家可能都已经尝试过ChatGPT,今天讲一讲与这个全新工具互动的不同方法。本文总结了6个可以使ChatGPT成为日常助手(甚至超越日常助手)的工具!1.【GoogleChromeExtension】在任何地方使用ChatGPT想在任何地方轻松地使用ChatGPT吗?那么你可以使用Chrome插件(h

See all articles

Hot AI Tools

Undresser.AI Undress

Undresser.AI Undress

AI-powered app for creating realistic nude photos

AI Clothes Remover

AI Clothes Remover

Online AI tool for removing clothes from photos.

Undress AI Tool

Undress AI Tool

Undress images for free

Clothoff.io

Clothoff.io

AI clothes remover

AI Hentai Generator

AI Hentai Generator

Generate AI Hentai for free.

Hot Article

R.E.P.O. Energy Crystals Explained and What They Do (Yellow Crystal)
2 weeks agoBy尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. Best Graphic Settings
2 weeks agoBy尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. How to Fix Audio if You Can't Hear Anyone
2 weeks agoBy尊渡假赌尊渡假赌尊渡假赌

Hot Tools

EditPlus Chinese cracked version

EditPlus Chinese cracked version

Small size, syntax highlighting, does not support code prompt function

Dreamweaver CS6

Dreamweaver CS6

Visual web development tools

WebStorm Mac version

WebStorm Mac version

Useful JavaScript development tools

SublimeText3 Mac version

SublimeText3 Mac version

God-level code editing software (SublimeText3)

DVWA

DVWA

Damn Vulnerable Web App (DVWA) is a PHP/MySQL web application that is very vulnerable. Its main goals are to be an aid for security professionals to test their skills and tools in a legal environment, to help web developers better understand the process of securing web applications, and to help teachers/students teach/learn in a classroom environment Web application security. The goal of DVWA is to practice some of the most common web vulnerabilities through a simple and straightforward interface, with varying degrees of difficulty. Please note that this software