HTML 및 자바 스크립트, window.prompt

javascript 및 html 유형의 자료에 새로 추가되었습니다. 나는 사용자로부터의 입력을 사용하여 테이블로 출력하는 간단한 예제를 만들고 싶었다. 실제로 창을 표시하는 데 문제가 있습니다. 나는 틀린 일을하고 있다는 것을 아주 분명히하지만, 현재 그것을보고 있지 않다는 것을 상상한다. 나는 학교에서 수업을 듣고 있는데, 이것은 숙제가 아니며, 스스로 연습하고있다.HTML 및 자바 스크립트, window.prompt

while 루프와 관련이 있습니까? 다른 방법으로 말하기 전까지 사용자에게 계속 메시지를 표시하는 방법에 대한 제안 사항은 무엇입니까?

<!DOCTYPE html> 
<html> 

<head> 
<meta charset="utf-8"> 
<title>Mileage Record</title> 
<style type = "text/css"> 
    table { 
     width:300px; 
     border-collapse:collapse; 
     background-color:lightblue; 
     } 
    table, td, th { 
     border: 1px solid black; 
     padding: 4px; 
     } 
    th { 
     text-align: left; 
     color: white; 
     background-color: darkblue 
     } 
    tr.oddrow { 
     background-color: white; 
     } 
</style> 

<script> 
    var milesDriven; 
    var gallonsUsed; 
    var mpg; 
    var anyMore; 

    document.writeln("<table>"); 
    document.writeln("<thead><tr><th>Miles Driven</th>"); 
    document.writeln("<th>Gallons Used</th>"); 
    document.writeln("<th>MPG</th>"); 
    document.writeln("</tr></thead><tbody>"); 

    while (anyMore == true) { 
     milesDriven = window.prompt("How many miles did you drive?"); 
     gallonsUsed = window.prompt("How many gallons did you use?"); 
     mpg = milesDrive/gallonsUsed; 
     document.writln("<tr><td>" + milesDriven + "</td><td>" + 
      gallonsUsed + "</td><td>" + mpg + "</td></tr>"); 

     anymore = confirm("Do you have any more data to input?"); 
    } 
    document.writeln("</tbody></table>"); 

</script>

출처

2012-06-24 jackie

는 접근 방식에 몇 가지 문제가 있습니다. 문서 내용을 수정하려면 document.writeln()을 사용하지 않아야합니다. 대신 요소를 만들고이를 문서 트리에 추가하십시오. 좋은 자바 스크립트 튜토리얼은 어떻게하는지 알려줄 것입니다. 또한 식별자는 대소 문자를 구분하므로 여기에 anyMore과 anymore을 쓸 수 없다는 것을 설명합니다. 또한 식별자에 다른 오타가 있습니다. 정의되지 않은 값이 true과 같지 않으므로 루프가 실행되지 않습니다.

출처

2012-06-24 21:47:05

감사합니다. 필자는 스크립트를 다시 작성한 후 오타가 발생했다고 생각합니다. 나는 지금 일하고있다. document.writeln과 요소 사용에 관해서 : 그것은 내가 생각했던 것입니다 (과거에 했었지만 오래 전에했습니다).하지만이 클래스에서는 document.writeln(), stupid, right ? – jackie

또한 우리가 사용하는 책은 Deitel의 5th Edition 인터넷 및 월드 와이드 웹이며 js use document.writeln의 처음 몇 장입니다. arghhhhh – jackie

<pre> 
<!DOCTYPE html> 
<html> 

<head> 
<meta charset="utf-8"> 
<title>Mileage Record</title> 
<style type = "text/css"> 
    table { 
     width:300px; 
     border-collapse:collapse; 
     background-color:lightblue; 
     } 
    table, td, th { 
     border: 1px solid black; 
     padding: 4px; 
     } 
    th { 
     text-align: left; 
     color: white; 
     background-color: darkblue 
     } 
    tr.oddrow { 
     background-color: white; 
     } 
</style> 

<script> 
    // var milesDriven; 
    // var gallonsUsed; 
    // var mpg; 
    var anyMore=0; 
    var str="<table>"; 
     str+="<thead><tr><th>Miles Driven</th>"; 
     str+="<th>Gallons Used</th>"; 
     str+="<th>MPG</th>"; 
     str+="</tr></thead><tbody>"; 


function milesDriven(){ 
    return window.prompt("How many miles did you drive?"); 
} 

function gallonsUsed(){ 
    return window.prompt("How many gallons did you use?"); 
} 

function mpg(){ 
return milesDriven()/gallonsUsed(); 
} 


function addComponentsToDOM(){ 
    while (anyMore<3) { //not 0 is true or not undefined is true or not null is true 
    str+="<tr><td>" + milesDriven() + "</td><td>" + 
      gallonsUsed() + "</td><td>" + mpg() + "</td></tr>" 
     // anymore = confirm("Do you have any more data to input?"); 
     anyMore++; 
    } 

    str+="</tbody></table>"; 
    //document.writeln(); i suggest you not use this method add component to DOM tree 
    //because this method first empty DOM tree content 
    document.body.innerHTML=str; 
} 


//why use this event,because window after loaded document.body not null 
window.onload=addComponentsToDOM; 


</script> 
</pre>

출처

2012-06-25 03:22:02 YangHongChang

내 QQ 계정 243030330, 나는 중국에서 왔어. – YangHongChang

HTML 및 자바 스크립트, window.prompt

답변

관련 문제