Local image preview (supports IE6/IE7/IE8/Firefox3) experience summary_javascript skills

Recently, I encountered the need for local image preview during the development of web projects. Although I couldn’t use it in the end due to other reasons, I still have some understanding and sorted it out.

Here we divide them by browsers, mainly including IE6, IE7/8 and Firefox3, excluding Opera, Safari and Chrome. These three basically have very little demand and have not been studied.

To summarize, :
Under IE6, you can get the image path directly from the value of file to display the preview.
Under IE7 and IE8, obtain the image path of file through select, and then use filters to display the preview.
Call the getAsDataURL method of file under FireFox to obtain the Data URI data to display the preview.

The following is a complete Demo:

Copy the code The code is as follows: