HTML 5の6大属性+ファイル+ストレージ

function fileUpload(files){	
  var str = "<li>";
  str = str + "<span>      </span>";
  str = str + "<span>      </span>";
  str = str + "<span>      </span>";
  for(var i=0;i<files.length;i++){
    var item = files[i];
    str = str + "<li>";
    str = str + "<span> " + item.name + " </span>";
    str = str + "<span> " + item.type + " </span>";
    str = str + "<span> " + item.size + " </span>";
    str = str + "</li>";
  }
document.getElementById("show").innerHTML = str;}


function prevImg(files){
  if(typeof FileReader == 'undefined'){
	alert("            ");}
  var str = "";
  for(var i=0;i<files.length;i++){
    var item = files[i];
    var reader = new FileReader();
    reader.readAsDataURL(item);
    reader.onload=function(e){//         onload  
	str = str + "<span>";
	str = str + "<img src='"+e.target.result+"' />";
	str = str + "</span>";
	document.getElementById("show").innerHTML = str ;
			}}
document.getElementById("show").innerHTML = str;
}

function nameChange(name){
   var strName = name.value;
   sessionStorage.setItem("name",strName);
   document.getElementById("show1").style.display = "block";
   document.getElementById("show1").innerHTML =     
                       sessionStorage.getItem("name");
}
function getValue(){
   document.getElementById("show1").style.display = "block";
   document.getElementById("show1").innerHTML =sessionStorage.getItem("name");
}
function loginCheck(){
  var strName = document.getElementById("name").value;
  var strPwd = document.getElementById("pwd").value;
  localStorage.setItem("userName",strName);
  if(document.getElementById("save").checked){
     localStorage.setItem("userPwd",strPwd);
  }
  document.getElementById("loginStatus").innerHTML = "    ";
}
function pageLoad(){
  var strName = localStorage.getItem("userName");
  var strPwd = localStorage.getItem("userPwd");
  if(strName){//js    (undefined/0)
	 document.getElementById("name").value=strName;
  }
  if(strPwd){
	document.getElementById("pwd").value=strPwd;
  }
}



function getValue(){
   document.getElementById("show").style.display = "block";
   document.getElementById("show").innerHTML =sessionStorage.getItem("name");
}



function loginCheck(){
  var strName = document.getElementById("name").value;
  var strPwd = document.getElementById("pwd").value;
  localStorage.setItem("userName",strName);
  if(document.getElementById("save").checked){
     localStorage.setItem("userPwd",strPwd);
  }
  document.getElementById("loginStatus").innerHTML = "    ";
}
function pageLoad(){
  var strName = localStorage.getItem("userName");
  var strPwd = localStorage.getItem("userPwd");
  if(strName){//js    (undefined/0)
	 document.getElementById("name").value=strName;
  }
  if(strPwd){
	document.getElementById("pwd").value=strPwd;
  }
}


6      

autofocus  :       ，         input  

	UserName: 
	
	Password: 
	
	


pattern  ：       ，            ，            

	UserName: 
	
	

	     ,    、      ，   6~8  



placeholder  :      （hint），          。  （hint）            ，             

  UserName:
  
  


required  :              （    ）

 UserName: 
 


datalist:            。      。  input          ，    input     


		

output:                 ，      、JS        
            

    

        
       
        
            *
        
            =
        
0
    
 


novalidate:              

    

        
     :
        
	
    
 

HTML5    
    

     
      :
     


     
      :
     


         


      :
        
	

    

accept:        

    
    :
        
        
        



FileReader    

        
    :
        
	



HTML5      
sessionStorage    (sessionStorage              ，      ，        )


	
sessionStorage
	
	
	





localStorage    (localStorage               ，           ，          )

  

  
  
  
     :
    :