2013-03-06 2 views
1

우리는해야 할 JavaScript 할당이 있습니다. 우리는 문장 생성자를 만들어야합니다. Chrome에서이 프로그램을 실행할 때 버튼을 클릭해도 아무런 변화가 없습니다. 콘솔 로그를 확인할 때 Uncaught ReferenceError: mySubject is not defined.라고 말하면 이미 정의한 것 같습니다 element1.onclick?자바 스크립트 출력이 표시되지 않습니다

이 지금까지 내 코드입니다 : 내가 그렇게 길을 잃기 시작하고 무엇을 할 생각이없는거야

<body> 
    <div id="container"> 
     <div id="buttons"> 
      <button id="btn1">Generate subject</button> 
      <input name="subject" type="text" id="subject" 
      /> 
      <button id="btn2">Generate verb</button> 
      <input name="verb" type="text" id="verb" /> 
      <button id="btn3">Generate adjective</button> 
      <input name="adj" type="text" id="adj" /> 
      <button id="btn4">Generate object</button> 
      <input name="object" type="text" id="object" /> 
     </div> 
     <!--buttons closing div--> 
     <div> 
      <p id="output">asjkldhfahfjasf;d</p> 
     </div> 
     <!--output closing div--> 
    </div> 
    <!--container closing div--> 
    <script> 
     var subject = new Array("Mel Gibson", "Optimus-Prime", "The Cat-lady", "The student", "My Dentist"); 

     var verb = new Array("licks", "pets", "hugs", "stabs", "eats"); 

     var adj = new Array("fat", "ugly", "delicious", "redundant", "hopeless"); 

     var object = new Array("cat", "bacon-strip", "dog-house", "bigmac", "hobo"); 


     var element1 = document.getElementById("btn1"); 
     var element2 = document.getElementById("btn2"); 
     var element3 = document.getElementById("btn3"); 
     var element4 = document.getElementById("btn4"); 

     element1.onclick = function() { 
      mySubject = subject[Math.random() * subject.length] 
     }; 

     element2.onclick = function() { 
      myVerb = verb[Math.random() * verb.length] 
     }; 

     element3.onclick = function() { 
      myAdj = adj[Math.random() * adj.length] 
     }; 

     element4.onclick = function() { 
      myObject = object[Math.random() * object.length] 
     }; 

     document.getElementById("output").innerHTML = mySubject + myVerb + " the" + myAdj + myObject + "."; 
    </script> 
</body> 

이는 내가 가지고있는 많은 문제 중 하나입니다.

편집 :

그래서 난 내 자바 스크립트와 도움을 얻고 이제 모든 출력을 제외하고 노력하고 있습니다. 출력 div에 출력하고 싶지만 아무 것도 출력하지 않습니다.

<h1>The Amazing Fantastical Sentence Generator!</h1> 

<h4>Have hours of fun with your imaginary friends!</h4> 
</div><!--title closing div--> 
<div id="buttons"> 

<button id="btn1">Generate subject</button> 
<input name="subject" type="text" id="insubject"/> 



<button id="btn2">Generate verb</button> 
<input name="verb" type="text" id="verb"/> 

<button id="btn3">Generate adjective</button> 
<input name="adj" type="text" id="adj"/> 


<button id="btn4">Generate object</button> 
<input name="object" type="text" id="object"/> 

<div > 
<p id="output"></p> 
</div><!--output closing div--> 

</div><!--container closing div--> 

<script> 


var subject=new Array("Mel Gibson", "Optimus-Prime", "The Cat-lady", "The student", "My  Dentist"); 

var verb=new Array("licks", "pets", "hugs", "stabs", "eats"); 

var adj=new Array("fat", "ugly", "delicious", "redundant", "hopeless"); 

var object=new Array("cat", "bacon-strip", "dog-house", "bigmac", "hobo"); 


var element1=document.getElementById("btn1"); 
var element2=document.getElementById("btn2"); 
var element3=document.getElementById("btn3"); 
var element4=document.getElementById("btn4"); 

element1.onclick=function() {document.getElementById('insubject').value=subject[Math.floor(Math.random()*(subject.length))];} 

element2.onclick=function(){document.getElementById('verb').value=verb[Math.floor(Math.random()*(verb.length))];} 

element3.onclick=function(){document.getElementById('adj').value=adj[Math.floor(Math.random()*(adj.length))];} 

element4.onclick=function(){document.getElementById('object').value=object[Math.floor(Math.random()*(object.length))];} 

document.getElementById("output").innerHTML= document.getElementById("insubject").value + document.getElementById("verb").value + " the" + document.getElementById("adj").value + document.getElementById("object").value + "."; 


</script> 
</body> 
</html> 

답변

0

그래서이 문제를 해결하는 방법을 알아 냈습니다.

내 코드를 다시 편집 한 후에 모든 버튼이 작동했지만 출력 div에 올바르게 출력되지 않았습니다. 그래서 모든 수학을 선언했습니다. 배열에 달린 무작위 방정식으로 모든 기본 응답이있었습니다. 또한 출력 div에 표시되는 기본 출력을 만들었습니다.

var subStr = subject[Math.floor(Math.random()*(subject.length))]; 
var verbStr = verb[Math.floor(Math.random()*(verb.length))]; 
var adjStr = adj[Math.floor(Math.random()*(adj.length))]; 
var objStr = object[Math.floor(Math.random()*(object.length))]; 

document.getElementById("output").innerHTML= subStr + " " + verbStr + " the " + adjStr + " " + objStr + " ."; 

그런 다음 내 onclick 이벤트를 변경했습니다.

element1.onclick=function(){ 

subStr = subject[Math.floor(Math.random()*(subject.length))]; 
document.getElementById('insubject').value=subStr; 
document.getElementById("output").innerHTML= subStr + " " + verbStr + " the " + adjStr + " " + objStr + " ."; 

} 

element2.onclick=function(){ 

verbStr = verb[Math.floor(Math.random()*(verb.length))]; 
document.getElementById('verb').value=verbStr; 
document.getElementById("output").innerHTML= subStr + " " + verbStr + " the " + adjStr + " " + objStr + " ."; 
} 


element3.onclick=function(){ 

adjStr= adj[Math.floor(Math.random()*(adj.length))]; 
document.getElementById('adj').value=adjStr; 
document.getElementById("output").innerHTML= subStr + " " + verbStr + " the " + adjStr + " " + objStr + " ."; 
} 

element4.onclick=function(){ 

objStr= object[Math.floor(Math.random()*(object.length))]; 
document.getElementById('object').value=objStr; 
document.getElementById("output").innerHTML= subStr + " " + verbStr + " the " + adjStr + " " + objStr + " ."; 
} 

이제 각 수학.무작위가 다시 계산되고 특정 텍스트 필드에 입력 된 다음 출력 div로 출력됩니다.

0

함수 내부에 선언 된 변수입니다 그 기능에 지역, 당신이 그들을 사용할 수 없다는 것을 의미 :이 지금 내 코드입니다 그 기능 밖에서. 변수를 함수 외부에서 전역 변수로 선언 해보십시오.

0

When I check the Console Log, it says Uncaught ReferenceError: mySubject is not defined. I thought I defined it already in element1.onclick function?

JavaScript 범위는 function scope입니다. 함수 내에서만 선언 된 변수는 함수와 중첩 된 함수는 액세스 할 수 있지만 외부 함수는 액세스 할 수 없습니다.

기능 밖에서 mySubject에 액세스하려면 verb, subject, etc..이있는 곳에서 신고해야합니다.

또한, document.getElementById 명령이 mySubject이라는 Click 이벤트가 할당되기 전에 여전히 문제가 발생하지만 다른 문제 일 수 있습니다. 다음과 같이

0

당신은 myVerb와 myAdj와 함께 것으로, mySubject 변수를 정의한다 : 당신은 function 내부를 정의하는

var mySubject; 
var myVerb; 
var myAdj; 
0

. 함수 밖에서 선언 한 다음 안에 값을 할당 해보십시오.

관련 문제