-3

only the else statement in main.js statement where it reads scores-=1 runs and the if condition doesnt even when the condition satisfies. even after clicking on the right option my scores value doesnt increase by 1 instead it always decreasesby 1 which means it only satisfies the else statement

index.html

<div class="buttons">

<button id="button0"><span id="option0"></span></button>  
<button id="button1"><span id="option1"></span></button>  
<button id="button2"><span id="option2"></span></button>  
<button id="button3"><span id="option3"></span></button>  
 </div>

main.js

  var questions =[{

   question:'abcbcb',
  options:['a','b','c','d'],
  answer:'b' 
 },   { 
  question:"capital of india",
   options:['delhi','mum','pune','kol'],
   answer:'delhi'

 }]
 var x = Math.floor(Math.random() * (questions.length));
 var scores = 0;


 function gameplay(){
var quesn = document.getElementById('question');
quesn.innerHTML =questions[x].question;
for(i=0;i<4;i++){
var opt = document.getElementById('option'+i);
opt.innerHTML = questions[x].options[i];
var score = document.getElementById('scores');
score.innerHTML = scores;
}

}

 gameplay();

 for(i=0;i<4;i++){
     var y = document.getElementById('button'+i);
     var z = document.getElementById('option'+i);
     y.onclick = function(){
        if((z.innerHTML) ==(questions[x].answer)){
            scores +=1;
        }
        else{
            scores -=1;
        }
        x=Math.floor(Math.random() * (questions.length));
         gameplay();
     }
 }
rohan
  • 81
  • 13

3 Answers3

2

For pure Javascript, use the innerHTML property.

For your example, use the following:

var spanVal = document.getElementById("option0").innerHTML;
1

var x = document.getElementById("option0").innerHTML;

console.log(x)

That is how you can attain the value, ".innerText" would also work.

(btw you labeled this as a question in java, this is javascript. Very different.

Hope this helps.

4cody
  • 344
  • 1
  • 18
1

WORKING SAMPLE

Replace this

 for(i=0;i<4;i++){
     var y = document.getElementById('button'+i);
     var z = document.getElementById('option'+i);
     y.onclick = function(){
        if((z.innerHTML) ==(questions[x].answer)){
            scores +=1;
        }
        else{
            scores -=1;
        }
        x=Math.floor(Math.random() * (questions.length));
         gameplay();
     }
   }

With this

 function answer(ans)
 {
var myAnswer = document.getElementById('option'+ans);
if(myAnswer.innerHTML == (questions[x].answer))
{
    scores += 1;
}
else{
    scores -= 1;
}
x=Math.floor(Math.random() * (questions.length));
     gameplay();

console.log(ans);
}

Then this

 <p id="question"></p> 
  <div class="buttons">
 <button id="button0"><span id="option0"></span></button>  
 <button id="button1"><span id="option1"></span></button>  
 <button id="button2"><span id="option2"></span></button>  
 <button id="button3"><span id="option3"></span></button>  
 </div>
 <p id = 'scores'></p>

With this

    <p id="question"></p> 
<div class="buttons">
<button id="button0" onclick ="answer('0')"><span id="option0"></span></button>  
<button id="button1" onclick ="answer('1')"><span id="option1"></span></button>  
<button id="button2" onclick ="answer('2')"><span id="option2"></span></button>  
<button id="button3" onclick ="answer('3')"><span id="option3"></span></button>  
</div>
<p id = 'scores'></p>
jerome
  • 695
  • 6
  • 20
  • 1
    edited it! sorry shud have done it earlier! please look into it – rohan Feb 24 '18 at 03:20
  • 1
    @rohan i think this is still incomplete, where is your `question` tag that you specified in your javascript function ? – jerome Feb 24 '18 at 03:23
  • 1
    well, i didnt mention it my question as that was not important and to avoid too much of code. – rohan Feb 24 '18 at 03:25
  • 1
    @rohan i cant identify your error because in your function you specify some elements that's not in your `document`, also it throws errors related to the elements that's not specified. [see this fiddle](https://jsfiddle.net/hpk47b92/10/) – jerome Feb 24 '18 at 03:32
  • 1
    there is

    ,i am not mentioning it to avoid ambiguity. everything else is working apart from if statement.
    – rohan Feb 24 '18 at 03:34
  • 1
    let me simplify it! i want to store the text value written inside a button on clicking it .how to do it from my code? – rohan Feb 24 '18 at 03:37
  • 1
    cant find what you edited. each line seems exactly similar to mine .. can you please write the particular lines of edited code ?thanks – rohan Feb 24 '18 at 03:46
  • 1
    @rohan please check it again – jerome Feb 24 '18 at 04:02
  • 1
    yeah this will work but can u tell me wat was the problem in my code? thanks btw – rohan Feb 24 '18 at 04:09
  • @rohan on your `for loop` it always throws `i` value as `4` thats the error – jerome Feb 24 '18 at 04:10
  • how? can u elaborate it? – rohan Feb 24 '18 at 04:13
  • @rohan at the last line of your `for` loop try `console.log(i)` you will see it always throws `4` – jerome Feb 24 '18 at 04:23
  • yeah i did try it initially but why it is doing so , i cannot understand that! i know i am being silly and repetitive ,sorry for that – rohan Feb 24 '18 at 04:26
  • @rohan i dont have exact idea either. but i think your `loop` is finishing all of the iteration first before proceeding to your code – jerome Feb 24 '18 at 04:30
  • @rohan no worries – jerome Feb 24 '18 at 04:34