0

How can I retrieve the value of the button? the value is always different

Let's say

newArr = [1,2,3,4,5,"A","B","C","D","E"]

The 3 buttons will always have different value, how can I retrieve it? I need the value because I need to do a score system when user choose on the correct button, therefore I need to know what is the value in the button that the user click to determine if the user is able to score a point or deduct points.

This is to random generate a value to put into the button

var index1 = newArr[Math.floor(Math.random()*newArr.length)];
document.getElementById("TO1").value = index1;
var Arr2 = newArr.splice(index1, 1);
        
//enter random element into Option 2
var index2 = newArr[Math.floor(Math.random()*newArr.length)];
document.getElementById("TO2").value = index2;
var Arr3 = newArr.splice(index2, 1);
        
//enter random element into Option 3
var index3 = newArr[Math.floor(Math.random()*newArr.length)];
document.getElementById("TO3").value = index3;

<html>
<input type="button" class="gameOpt" id="TO1" value="Option 1" >
<input type="button" class="gameOpt" id="TO2" value="Option 2" >
<input type="button" class="gameOpt" id="TO3" value="Option 3" >
</html>

I am using this in the script, but I am sure this is not working

var option1 = document.getElementById("TO1").value;
var option2 = document.getElementById("TO2").value;
var option3 = document.getElementById("TO3").value;
Improve this question
2
  • What do you get from logging document.getElementById("TO1") and index1? Commented Nov 10, 2020 at 13:12
  • @Camilo for index 1, i get the value of what is displayed on the button, for document.getElementById("TO1") i don't get anything when i console.log it Commented Nov 10, 2020 at 13:32

2 Answers 2

Reset to default
1

I hope I understood the task correctly.

Arbitrary values of the buttons are currently set and when clicked it returns the ID of the button and its value

var newArr = [1, 2, 3, 4, 5, "A", "B", "C", "D", "E"];

var buttons = document.getElementsByClassName("gameOpt");

//enter random element into Option 1
var index1 = rand();
document.getElementById("TO1").value = index1;

//enter random element into Option 2
var index2 = rand();
document.getElementById("TO2").value = index2;

//enter random element into Option 3
var index3 = rand();
document.getElementById("TO3").value = index3;

function rand() {
    var res = Math.floor(Math.random() * newArr.length);
    return newArr[res];
}

for (var i = 0; i < buttons.length; i++) {
    buttons[i].addEventListener("click", function () {
        var val = this.value;
        var id = this.id;
        console.log(id, val)
    });
}
<input type="button" class="gameOpt" id="TO1" value="Option 1">
<input type="button" class="gameOpt" id="TO2" value="Option 2">
<input type="button" class="gameOpt" id="TO3" value="Option 3">

Improve this answer
Sign up to request clarification or add additional context in comments.

1 Comment

can you take a look at my previous question please ><!!!stackoverflow.com/questions/64766735/…
0

Placed into a running snippet, this is working just fine. I added a console.log() loop at the end, which you can use to verify.

newArr = [1,2,3,4,5,"A","B","C","D","E"];

var index1 = newArr[Math.floor(Math.random()*newArr.length)];
document.getElementById("TO1").value = index1;
var Arr2 = newArr.splice(index1, 1);
        
//enter random element into Option 2
var index2 = newArr[Math.floor(Math.random()*newArr.length)];
document.getElementById("TO2").value = index2;
var Arr3 = newArr.splice(index2, 1);
        
//enter random element into Option 3
var index3 = newArr[Math.floor(Math.random()*newArr.length)];
document.getElementById("TO3").value = index3;

for (var i = 1; i < 4; i++) {
  console.log(document.getElementById("TO"+i).value);
}
<input type="button" class="gameOpt" id="TO1" value="Option 1" >
<input type="button" class="gameOpt" id="TO2" value="Option 2" >
<input type="button" class="gameOpt" id="TO3" value="Option 3" >

Improve this answer

2 Comments

can you take a look at my previous question? stackoverflow.com/questions/64766735/…
Let's see if we can get this one closed out before I look at another.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.