https://kidscall.kr/design/js/jquery.nicefileinput.js

1/*
2jQuery.NiceFileInput.js
3--------------------------------------
4Nice File Input - jQuery plugin which makes file inputs CSS styling an easy task.
5By Jorge Moreno - @alterebro 
6
7Licensed under the MIT license: http://www.opensource.org/licenses/mit-license.php
8Based on previous work of:
9	- Shaun Inman (concept) http://www.shauninman.com/archive/2007/09/10/styling_file_inputs_with_css_and_the_dom
10	- Mika Tuupola (jQuery plugin implementation) http://www.appelsiini.net/projects/filestyle
11*/
12(function($) {
13	$.fn.nicefileinput = function(options) {
14		var settings = { 
15			label : '찾아보기...', // Default button text
16			fullPath: false
17		};
18		if(options) { $.extend(settings, options); };
19		
20		return this.each(function() {
21			var self = this;
22			
23			if ($(self).attr('data-styled') === undefined) {
24			
25				var r = Math.round(Math.random() * 10000);
26				var d = new Date();
27				var guid = d.getTime() + r.toString();
28				
29				var filename = $('<input type="text" readonly="readonly">')
30					.css({
31						'display': 'block',
32						'float': 'left',
33						'margin': 0,
34						'padding': '0 5px'
35					})
36					.addClass('NFI-filename NFI' + guid);
37				var wrapper = $('<span>')
38					.css({
39						'overflow': 'hidden',
40						'position': 'relative',
41						'top': '0px',
42						'float': 'left',
43						'white-space': 'nowrap',
44						'text-align': 'center',
45						'vertical-align': 'baseline'
46					})
47					.addClass('NFI-button NFI' + guid)
48					.html(settings.label);
49				
50				
51				$(self).after(filename);
52				$(self).wrap(wrapper);
53				
54				$('.NFI' + guid).wrapAll('<div class="NFI-wrapper" id="NFI-wrapper-' + guid + '" />');
55				$('.NFI-wrapper').css({
56					'overflow': 'hidden',
57					'display': 'inline-block',
58					'vertical-align': 'middle'
59				});
60				$('#NFI-wrapper-' + guid).addClass($(self).attr('class'));
61				
62				$(self)
63					.css({
64						'opacity': 0,
65						'position': 'absolute',
66						'border': 'none',
67						'margin': 0,
68						'padding': 0,
69						'top': 0,
70						'right': 0,
71						'cursor': 'pointer',
72						'height': '60px'
73					})
74					.addClass('NFI-current');
75				$(self).on('change', function() {
76					var fullPath = $(self).val();
77					if (settings.fullPath) {
78						filename.val(fullPath); 
79					} else {
80						var pathArray = fullPath.split(/[/\\]/);
81						filename.val(pathArray[pathArray.length - 1]);
82					}
83				});
84				$(self).attr('data-styled', true);
85			}
86		});
87	};
88})(jQuery);