We Keep Coding

What is the error when im trying to add image?

The output should be that every time that there is an opponent's player around the click, he becomes the player who is currently pressed. The code I sent is a check for the row above and chanching its image. The problem is that every time it comes to adding the image, it writes a red line underneath and nothing happens. What is the reason for this?
function Eating_Action(idClicked, rowClicked, colClicked) {
IDRup = (rowClicked - 1) * BoardSize + colClicked;
IDRdown = (rowClicked + 1) * BoardSize + colClicked
IDCright = rowClicked * BoardSize + (colClicked + 1);
IDCleft = Number(rowClicked) * Number(BoardSize) + (Number(colClicked) - 1);
IDDleftdown = Number(First1Clicked) + Number(Number(BoardSize) - 1);
IDDleftup = (rowClicked - 1) * BoardSize + (colClicked - 1);
IDDrightdown = Number(First1Clicked) + Number(Number(BoardSize) + 1);
IDDrightup = (First1Clicked) - (BoardSize - 1);
//check all the pieces around the place that was clicked and change it to
if (intBoard[rowClicked][colClicked] == 1) {
//check eating for UP ROW
if (rowClicked - 1 >= 0) {
if (intBoard[rowClicked - 1][colClicked] == 2) {
document.getElementById(IDRup).innerHTML = "<img width='50px' height='50px' src='O.png'/>";
intBoard[rowClicked - 1][colClicked] = 1;
}
}

How to create a loop that asks a new random addition question after answering the previous question

I am working on creating a small 5 question addition quiz that asks the user a new random addition question every time they answer the previous one. I would like to be able to have my script ask a new question every time the user clicks on the "check answer" button without having to refresh the page. Then, once the user has completed the 5 questions, I would like to be able to have a popup state they have completed the quiz and can refresh the page to start a new quiz. With my current code, the script asks a random addition question, and then once the user clicks on the "check answer" button, the user must refresh the page to get a new question. I am stuck on figuring out how to modify my current code to fit what I am trying to do. I am thinking that a while loop may be they way to go, but I don't really know how to implement it. The code that I have so far is: `
<h1>Addition Quiz!</h1>
<p>This short 5 question quiz will test your addition skills! Answer the question as the computer asks it and pat yourself on the back for each correct answer!</p>
<h3 id="mathquestion"></h3>
<input type="text" name="answerbox" id="answerbox">
<button onclick="addition()">Check Answer</button>
<script>
var minimum = 1;
var maximum = 9;
var intiger1 = Math.floor(Math.random() * (maximum - minimum + 1)) + minimum;
var intiger2 = Math.floor(Math.random() * (maximum - minimum + 1)) + minimum;
document.getElementById("mathquestion").innerHTML = intiger1 + " " + "+" + " " + intiger2;
var questionanswer = intiger1 + intiger2;
function addition() {
var useranswer = document.getElementById('answerbox').value;
if (useranswer == questionanswer) {
alert("Correct! Congrats!");
} else {
alert("Sorry, your answer is incorrect. Better luck with the next question!")
}
}
</script>`

So what you want is the part that setups your question into a new function. And run that function when the answer is right. An example:
<script>
var minimum = 1;
var maximum = 9;
var questionanswer = 0;
setupQuestion();
function setupQuestion(){
var intiger1 = Math.floor(Math.random() * (maximum - minimum + 1)) + minimum;
var intiger2 = Math.floor(Math.random() * (maximum - minimum + 1)) + minimum;
document.getElementById("mathquestion").innerHTML = intiger1 + " " + "+" + " " + intiger2;
questionanswer = intiger1 + intiger2;
}
function addition() {
var useranswer = document.getElementById('answerbox').value;
if (useranswer == questionanswer) {
alert("Correct! Congrats!");
setupQuestion();
} else {
alert("Sorry, your answer is incorrect. Better luck with the next question!")
}
}
</script>`

Just update the variable
<script>
var minimum = 1;
var maximum = 9;
var intiger1 = Math.floor(Math.random() * (maximum - minimum + 1)) + minimum;
var intiger2 = Math.floor(Math.random() * (maximum - minimum + 1)) + minimum;
document.getElementById("mathquestion").innerHTML = intiger1 + " " + "+" + " " + intiger2;
var questionanswer = intiger1 + intiger2;
function addition() {
var useranswer = document.getElementById('answerbox').value;
if (useranswer == questionanswer) {
alert("Correct! Congrats!");
} else {
alert("Sorry, your answer is incorrect. Better luck with the next question!")
}
// Updating question
intiger1 = Math.floor(Math.random() * (maximum - minimum + 1)) + minimum;
intiger2 = Math.floor(Math.random() * (maximum - minimum + 1)) + minimum;
document.getElementById("mathquestion").innerHTML = intiger1 + " " + "+" + " " + intiger2;
}
</script>

Issue with outputting scoring result in a Craps game

I'm working on a somewhat simply dice game but I can't get it to display the alert popup when I click the button.
I'm also trying to figure out the simplest way to check if housescore or myscore = maxscore then alert "congratulations, you win" or "sorry, you lost"
Here is my code:
var myscore = 0;
var maxScore = 100;
var housescore = 0;
function rollDice() {
var x = Math.floor(Math.random() * 6) + 1;
var y = Math.floor(Math.random() * 6) + 1;
if (x + y == 7 || 11) {
housescore = (housescore + 10);
alert("CRAPS" + " Your Score is " + "Player: " + myscore + "House: " + housescore);
} else if (x == y && x + y == isEven(n)) {
myscore = (myscore + 10);
alert("Even Up" + " Your Score is " + "Player: " + myscore + "House: " + housescore);
}
if (x == y && x + y == isOdd(n)) {
housescore = (housescore + 10);
alert("Odd Ball" + " Your Score is " + "Player: " + myscore + "House: " + housescore);
} else {
alert("You rolled a " + x + " and a " + y + " Your Score is " + "Player: " + myscore + "House: " + housescore);
}
}
function isEven(n) {
return n % 2 == 0;
}
function isOdd(n) {
return Math.abs(n % 2) == 1;
}
<input type="button" value="Roll The Dice" onClick="rollDice()" />

This is what I think you're after. I broke down your ifs to handle both cases where x == y in one branch, and used a simple mod operation to determine whether a die roll was even, and an else to handle the odd die rolls.
var myscore = 0;
var maxScore = 100;
var housescore = 0;
function rollDice() {
var x = Math.floor(Math.random() * 6) + 1;
var y = Math.floor(Math.random() * 6) + 1;
var total = x + y;
msg = "You rolled " + x + "," + y + " = " + total + "\n";
if (total == 7 || total == 11) {
housescore += 10;
msg += "CRAPS";
} else if (x == y) { // this condition contains two possible outcomes, handle both within this else if
if (x % 2 == 0) {
myscore += 10;
msg += "Even Up";
} else {
housescore += 10;
msg += "Odd Ball";
}
}
msg += " Your Score is " + "Player: " + myscore + ", House: " + housescore;
alert(msg);
}
<!DOCTYPE html>
<html>
<body>
<input type="button" value="Roll The Dice" onClick="rollDice()" />
</body>
</html>

Code like this is wrong:
if (x == y && x + y == isEven(n))
You haven't declared an n variable. And it makes no sense to compare the addition of two numbers to the true or false value that isEven() and isOdd() return. I think what you meant was:
if (x == y && isEven(x + y))
But when the two numbers are equal, adding them together will always be even, so I'm not sure what the point of that test is. Maybe you mean:
if (x == y && isEven(x))
I'm not familiar with a rule in Craps where the house or player win depending on whether equal dice are even or odd.
This is also wrong:
if (x == 7 && y == 11)
x and y are numbers from 1 to 6, so they can't be 7 or 11. In craps you add the two dice, so this should be:
if (x + y == 7 || x + y == 11)
There's little need for both isEven() and isOdd() functions -- a number is odd if it's not even.

<!DOCTYPE html>
<html>
<body>
<input type="button" value="Roll The Dice" onClick="rollDice()" />
<br />
<script type="text/javascript">
var score = 0;
var maxScore = 50;
var rolls = 0;
var maxRolls = 20;
function rollDice()
{
var x = Math.floor( Math.random() * 6 ) + 1;
var y = Math.floor( Math.random() * 6 ) + 1;
if( x == y )
{
score = getScore( x );
alert("You threw a Double " + x + " Your Score is "+ score);
}
else
{
alert("You threw a " + x + " and a " + y + " Your Score is " + score);
}
rolls++;
if (rolls == maxRolls && score < maxScore)
{
alert("Sorry You Lose!");
score = 0;
rolls = 0;
return;
}
else if (score >= maxScore)
{
alert("Congratulations You Win!");
score = 0;
rolls = 0;
return;
}
}
function getScore(x)
{
switch( x )
{
case 1:
score += 5;
break;
case 2:
score += 5;
break;
case 3:
score = 0;
break;
case 4:
score += 5;
break;
case 5:
score += 5;
break;
case 6:
score += 25;
break;
}
return score;
}
</script>
</body>
</html>
</html>

.append not working on click

Simple button that should be creating new <p> elements when its clicked but it isn't working and I'm not sure why as I've compared it to other code of mine.
Demo
var battle = function() {
while(monsterHP > 0){
var playerDam = Math.floor(Math.random() * ((playerAtk - monsterAtk) + 2);
$('#battle').append("<p>You have hit the monster for " + playerDam + " damage. The monster has " + (monsterHP - playerDam) + "HP left</p>");
monsterHP -= playerDam;
if(monsterHP <= 0) {
$('#battle').append("<p>You have defeated the monster</p>");
}
}
}
$('#battleButton').click(function() {
battle();
}

You have many syntax errors in your code. If you correct them (as below), then it works fine. When you write a JQuery append, you need to put a ')' after your argument. Likewise, functions need to have a '}' after them.
var playerAtk = 5;
var playerDef = 5;
var playerHP = 10;
var monsterAtk = 4;
var monsterDef = 4;
var monsterHP = 8;
var battle = function() {
while(monsterHP > 0){
var playerDam = Math.floor(Math.random() * ((playerAtk - monsterAtk) + 2));
$('#battle').append("<p>You have hit the monster for " + playerDam + " damage. The monster has " + (monsterHP - playerDam) + "HP left</p>");
monsterHP -= playerDam;
if(monsterHP <= 0) {
$('#battle').append("<p>You have defeated the monster</p>");
}
}
}
$('#battleButton').click(function() {
battle();
});

looking for a way to simplify this if/else statement. javascript

So, I have a function (i am workng with jquery ui and running this on drag event, though for this question I don't think that is important)
Basically I have the following repetitive if else code:
And I am curious if there is a way to write this in one line(ish) and not have a 100 else if lines if I want to be able to support 100 steps (divisions of a total slider value).
var thisPos = $( ".sliderknob" ).position();
var x = thisPos.left - window['sliderhome'].left;
console.log("(" + x + ")");
l = Object.keys(obj_frameindex).length;
framefraction = 290/l;
if (x>-1 && x<framefraction){
console.log('frame 1');
frameselector(0);
$('#framecounter').html("FRAME " + 1);
}
else if (x>framefraction && x<framefraction*2){
console.log('frame 2');
frameselector(1);
$('#framecounter').html("FRAME " + 2);
}
else if (x>framefraction*2 && x<framefraction*3){
console.log('frame 3');
frameselector(2);
$('#framecounter').html("FRAME " + 3);
}
else if (x>framefraction*3 && x<framefraction*4){
console.log('frame 4');
frameselector(3);
$('#framecounter').html("FRAME " + 4);} //etc..........
Showing only 4 here, but imagine it goes on...
Any ideas?

One possible approach:
var frameNo = Math.max(0, Math.floor(x / framefraction)) + 1;
console.log('frame ' + frameNo);
frameselector(frameNo - 1);
$('#framecounter').html('FRAME ' + frameNo);

Do something like:
if x < 0 { return };
var f = Math.ceil(x / framefraction);
console.log(`frame` + f);
frameselector(f - 1);
$(`#framecounter`).html("FRAME " + f);