htmlÔõôÉÏ´«Îļþ
¿ÉÒÔʹÓà html ÖÐµÄ ÔªËØÉÏ´«Îļþ£¬Æä type ÊôÐÔÐèÉèÖÃΪ “file”£¬²¢¿ÉÉèÖà name ºÍ accept ÊôÐÔÀ´Ö¸¶¨ÎļþÃû³ÆºÍ½ÓÊܵÄÎļþÀàÐÍ¡£±ðµÄ£¬¿ÉÒÔͨ¹ý html ±íµ¥»ò javascript À´´¦ÀíÉÏ´«µÄÎļþ¡£
ÔõÑùʹÓà HTML ÉÏ´«Îļþ
HTML ÖÐÌṩÁË ÔªËØ£¬Ëü¿ÉÒÔʵÏÖÎļþµÄÉÏ´«¹¦Ð§¡£ÏÂÃæÊÇʹÓà HTML ÉÏ´«ÎļþµÄ°ì·¨£º
Ìí¼Ó ÔªËØ
ÔªËØµÄ type ÊôÐÔÉèÖÃΪ “file”£¬ÒÔÖ¸¶¨ËüµÄÀàÐÍΪÎļþÉÏ´«¡£
<input type="file" name="myFile">
µÇ¼ºó¸´ÖÆ
ÉèÖÃ name ÊôÐÔ
name ÊôÐÔÖ¸¶¨ÁËÉÏ´«µÄÎļþµÄÃû³Æ¡£
Á¬Ã¦Ñ§Ï°¡°Ç°¶ËÃâ·ÑѧϰÌõ¼Ç£¨ÉîÈ룩¡±£»
ÉèÖÃ accept ÊôÐÔ
accept ÊôÐÔÖ¸¶¨Á˱»½ÓÊܵÄÎļþÀàÐÍ¡£ÀýÈ磬ҪÏÞÖÆÖ»½ÓÊÜͼÏñÎļþ£¬¿ÉÒÔÉèÖÃÈçÏ£º
<input type="file" name="myImage" accept="image/*">
µÇ¼ºó¸´ÖÆ
´¦ÀíÉÏ´«µÄÎļþ
µ±Óû§Ñ¡Ôñ²¢Ìá½»Îļþºó£¬¿ÉÒÔʹÓà HTML ±íµ¥»ò JavaScript À´´¦ÀíÉÏ´«µÄÎļþ¡£
ʹÓà HTML ±íµ¥´¦ÀíÉÏ´«µÄÎļþ
Ïò
ÔªËØÖÐÌí¼Ó enctype=”multipart/form-data” ÊôÐÔ£¬ÒÔÆôÓÃÎļþÉÏ´«¹¦Ð§¡£
µÇ¼ºó¸´ÖÆ <input type=”file” name=”myFile”>
ÔÚЧÀÍÆ÷¶Ë£¬¿ÉÒÔʹÓà PHP¡¢Python »òÆäËûÓïÑÔÀ´´¦ÀíÉÏ´«µÄÎļþ¡£
ʹÓà JavaScript ´¦ÀíÉÏ´«µÄÎļþ
ʹÓà JavaScript ¿ÉÒÔͨ¹ý¼àÌý change ÊÂÎñÀ´´¦ÀíÎļþÉÏ´«¡£
const input = document.querySelector('input[type="file"]'); input.addEventListener('change', function() { const files = this.files; // ´¦ÀíÉÏ´«µÄÎļþ });
µÇ¼ºó¸´ÖÆ
ÒÔÉÏÊÇʹÓà HTML ÉÏ´«ÎļþµÄ°ì·¨¡£Í¨¹ýÉèÖà ԪËØµÄ type¡¢name ºÍ accept ÊôÐÔ£¬ÒÔ¼°Ê¹Óà HTML ±íµ¥»ò JavaScript ´¦ÀíÉÏ´«µÄÎļþ£¬¿ÉÒÔʵÏÖÎÞаµÄÎļþÉÏ´«¹¦Ð§¡£
ÒÔÉϾÍÊÇhtmlÔõôÉÏ´«ÎļþµÄÏêϸÄÚÈÝ£¬¸ü¶àÇë¹Ø×¢±¾ÍøÄÚÆäËüÏà¹ØÎÄÕ£¡