js 차량 관리 시스템 구현

본 논문 의 사례 는 js 가 차량 관리 시스템 을 실현 하 는 구체 적 인 코드 를 공유 하여 여러분 께 참고 하 시기 바 랍 니 다.구체 적 인 내용 은 다음 과 같 습 니 다.
1.순환 으로 차량 관련 속성 추가
1.차 명 추가
2.번호 추가
3.연도 추가
4.차 령 추가
5.산지 추가
요구:위 에 추 가 된 모든 정 보 는 비어 있 으 면 안 됩 니 다.비어 있 으 면 프로그램 이 해당 하 는 정 보 를 알려 주 고 프로그램 이 중단 되 며 원본 상 태 를 복원 합 니 다.(다시 시작

2.수요:
 1.방금 추 가 된 차량 번호 에 따라 조회 하면 두 가지 업무 논리 가 존재 한다.첫 번 째,번호 가 존재 하지 않 습 니 다.조회 가 되 지 않 았 음 을 나타 내 고 이 차량 정 보 를 조회 하지 못 했 음 을 알려 줍 니 다.
 2.조회 버튼 을 누 르 면 창 이 열 리 고 취소 버튼 을 누 르 면 해당 차량 의 정보 가 존재 하지 않 음 을 알 립 니 다.
 3.조회 버튼 을 누 르 면 팝 업 창 에 존재 하지 않 는 번 호 를 마음대로 입력 합 니 다.이때 취소 버튼 을 누 르 면 해당 차량 의 정보 가 존재 하지 않 음 을 알 립 니 다.
3.차량 정 보 를 여러 번 추가 할 필요 가 없습니다.
4.정상 적 인 조회 성공,인터페이스 효 과 는 다음 과 같 습 니 다.

5.입력 한 조회 번호 가 존재 하지만 취소 단 추 를 누 르 면 이 차량 정보 가 존재 하지 않 음 을 알려 줍 니 다.
아래 코드 바로 올 리 기:
묻 지 마 세 요.게 으 름 입 니 다.table 레이아웃 으로 쓴 것 입 니 다.여러분 이 table 레이아웃 을 사용 하 는 것 을 권장 하지 않 습 니 다.

<form action="">
 <table border="1" cellspacing=0 id="tab">
 <tr id="tab_tr_one">
  <td colspan="5" >          </td>
 </tr>
 <tr style="text-align: center;">
  <td><input type="button" value="1、    " onclick="add()"></td>
  <td><input type="button" value="2、    " onclick="sel()"></td>
  <td><input type="button" value="3、    " onclick="update()"></td>
  <td><input type="button" value="4、    "></td>
  <td><input type="button" value="5、    "></td>
 </tr>
 <tr><td colspan="5">&emsp;<span id="name"></span></td></tr>
 <tr><td colspan="5">&emsp;<span id="id"></span></td></tr>
 <tr><td colspan="5">&emsp;<span id="year"></span></td></tr>
 <tr><td colspan="5">&emsp;<span id="age"></span></td></tr>
 <tr><td colspan="5">&emsp;<span id="address"></span></td></tr>
 <tr id="tab_tr_enight"><td colspan="5">    </td></tr>
 <tr style="text-align: center;">
  <td><span id="cname"></span></td>
  <td><span id="cid"></span></td>
  <td><span id="cyear"></span></td>
  <td><span id="cage"></span></td>
  <td><span id="cadderss"></span></td>
 </tr>
 </table>
</form>

JavaScript 부분 코드

<script> 
 //      
 function add(){
 //      ，         
 function car(a,b,c,d,e){
  this.a=a;
  this.b=b;
  this.c=c;
  this.d=d;
  this.e=e;
 }

 //       span  
 car.prototype.show=function(){
  //  span  ，       span  
  var carn=document.getElementById("name");
  var cari=document.getElementById("id");
  var cary=document.getElementById("year");
  var cara=document.getElementById("age");
  var caradd=document.getElementById("address");
  
  carn.innerText="  ："+this.a;
  cari.innerHTML="  ："+this.b;
  cary.innerHTML="  ："+this.c;
  cara.innerHTML="  ："+this.d;
  caradd.innerHTML="  ："+this.e;
 }
 
 //        
 var carName=prompt("     ");
 //      ，    
 if(carName)
 {
  var carId=prompt("     ");
  if(carId)
  {
  var carYear=prompt("     ");
  if(carYear)
  {
   var carAge=prompt("     ");
   if(carAge)
   {
   var carAddress=prompt("     ");
   if(carAddress)
   {
    var sum=new car(carName,carId,carYear,carAge,carAddress);
    sum.show();
   }
   else if(carAddress==="")
   {
    alert("      ")
    add();
   }
   else{alert("      ")}
   }
   else if(carAge==="")
   {
   alert("      ")
   add();
   }
   else{alert("      ")}
  }
  else if(carYear==="")
  {
   alert("      ")
   add();
  }
  else{alert("      ")}
  }
  else if(carId==="")
  {
  alert("      ")
  add();
  }
  else{alert("      ")}
 }
 //          ，      
 else if(carName===""){
  alert("      ")
  add();
 }
 //        ，    
 else{alert("      ") }
 }
 
 //     
 function sel(){
 var id=prompt("           ");
 
 //          
 var carn=document.getElementById("name").innerHTML
 var cary=document.getElementById("year").innerHTML
 var cara=document.getElementById("age").innerHTML
 var caradd=document.getElementById("address").innerHTML

 //           
 var cari=document.getElementById("id").innerHTML;
 //            (          “  ：”)
 var cid=cari.substr(3,cari.length).trim();

 //                     
 if(id)
 {
  //                        ，         
  if(id.trim()==cid){
  //              
  document.getElementById("cid").innerHTML="  ："+cid;
  document.getElementById("cname").innerHTML=carn;
  document.getElementById("cyear").innerHTML=cary;
  document.getElementById("cage").innerHTML=cara;
  document.getElementById("cadderss").innerHTML=caradd;
  }
  //                   
  else{alert("         ")}
 }
 //                      
 else if(id===""){
  alert("        ");
 }
 //         
 else{alert("        ");}


 }
 
 //     
 function update(){
 var id=prompt("           ");
 //           
 var cari=document.getElementById("id").innerHTML;
 //            (          “  ：”)
 var cid=cari.substr(3,cari.length).trim();
 if(id){
  //                    
  if(id==cid){
  var sum=prompt("1、   2、   3、   4、   5、  ");
  switch(sum){
   case '1':one();break;
   case '2':three();break;
   case '3':four();break;
   case '4':five();break;
   case '5':tui();break;
   default:alert("       ");break;
  }
  }
  //                    ，               
  else{
  var sum=prompt("1、   2、   3、   4、   5、  ");
  switch(sum){
   case '1':alert("    ");break;
   case '2':alert("    ");break;
   case '3':alert("    ");break;
   case '4':alert("    ");break;
   case '5':tui();break;
   default:alert("       ");break;
  }
  }
 }
 //                    ，               
 else if(id===""){
  var sum=prompt("1、   2、   3、   4、   5、  ");
  switch(sum){
   case '1':alert("    ");break;
   case '2':alert("    ");break;
   case '3':alert("    ");break;
   case '4':alert("    ");break;
   case '5':tui();break;
   default:alert("       ");break;
  }
 }
 else{
  alert("        ")
 }
 }
 //     
 function tui(){
 var result=confirm("     ");
 if(result==true){
  alert("   ");
 }
 else{  }
 }
 //           
 function one(){
 //          
 var cone=prompt("     ").trim();
 //           span  
 document.getElementById("name").innerHTML="  ："+cone;
 var cone1=document.getElementById("cname");
 if(cone1.innerHTML!=""){
  cone1.innerHTML="  ："+cone;
 }
 else{
  cone1="";
 }
 }
 //           
 function three(){
 //          
 var cthree=prompt("     ").trim();
 //           span  
 document.getElementById("year").innerHTML="  ："+cthree;
 var cthree1=document.getElementById("cyear");
 if(cthree1.innerHTML!=""){
  cthree1.innerHTML="  ："+cthree;
 }
 else{
  cthree1="";
 }
 }
 //           
 function four(){
 //          
 var cfour=prompt("     ").trim();
 //           span  
 document.getElementById("age").innerHTML="  ："+cfour;
 var cfour1=document.getElementById("cage");
 if(cfour1.innerHTML!=""){
  cfour1.innerHTML="  ："+cfour;
 }
 else{
  cfour1="";
 }
 }
 //           
 function five(){
 //          
 var cfive=prompt("     ").trim();
 //           span  
 document.getElementById("address").innerHTML="  ："+cfive;
 var cfive1=document.getElementById("caddress");
 if(cfive1.innerHTML!=""){
  cfive1.innerHTML="  ："+cfive;
 }
 else{
  cfive1="";
 }
 }
</script>

시청 해 주 셔 서 감사합니다!!
이상 이 바로 본 고의 모든 내용 입 니 다.여러분 의 학습 에 도움 이 되 고 저 희 를 많이 응원 해 주 셨 으 면 좋 겠 습 니 다.