Everything works well but the equals sign do not work. Does anyone know why and how to fix it? I am wondering why the eval('=') won't work in this case.
function calcu(calcValue) {
if (calcValue == '1') {
calc.output.value = '1';
} else if (calcValue == '2') {
calc.output.value = '2';
} else if (calcValue == '3') {
calc.output.value = '3';
} else if (calcValue == '+') {
calc.output.value = '+';
} else if (calcValue == '4') {
calc.output.value = '4';
} else if (calcValue == '5') {
calc.output.value = '5';
} else if (calcValue == '6') {
calc.output.value = '6';
} else if (calcValue == '-') {
calc.output.value = '-';
} else if (calcValue == '7') {
calc.output.value = '7';
} else if (calcValue == '8') {
calc.output.value = '8';
} else if (calcValue == '9') {
calc.output.value = '9';
} else if (calcValue == '*') {
calc.output.value = '*';
} else if (calcValue == '') {
calc.output.value = '';
} else if (calcValue == '0') {
calc.output.value = '0';
} else if (calcValue == '/') {
calc.output.value = '/';
} else // <-- Notice no condition on this last else
{
calc.output.value = eval('='); // <-- the eval() function turns the collection of string into a working math function
}
}
Related
hi everyone i am jonnathan i am trying to create a calculator in javascript and i am following a tutorial on youtube but for some reason if i add 1 and 1 together the result 2 is alerting
var number1 = prompt("Input the first number");
var op = prompt("Input operator")
var number2 = prompt("Input 3rd number")
if (op == "+") {
if (number1 == "1") {
if (number2 == "1") {
alert("2");
}
if (number2 == "2") {
alert("3");
}
if (number2 == "3") {
alert("4");
}
if (number2 == "4") {
alert("5");
}
if (number2 == "5") {
alert("6");
}
if (number2 == "6") {
alert("7");
}
if (number2 == "7") {
alert("8");
}
if (number2 == "8") {
alert("9");
}
if (number2 == "9") {
alert("10");
}
}
if (number2 == "1") {
if (number1 == "1") {
alert("2");
}
if (number1 == "2") {
alert("3");
}
if (number1 == "3") {
alert("4");
}
if (number1 == "4") {
alert("5");
}
if (number1 == "5") {
alert("6");
}
if (number1 == "6") {
alert("7");
}
if (number1 == "7") {
alert("8");
}
if (number1 == "8") {
alert("9");
}
if (number1 == "9") {
alert("10");
}
}
}
twice there are no errors in the console either that i think could help me with this issue
so far the calculator only adds numbers and only does it through 1 ti 9. how can i fix this error?
In your code:
if (op == "+") {
if (number1 == "1")
{
if (number2 == "1")
{
alert("2");
}
This section is alerting "2" first. And then this section:
if (number2 == "1") {
if (number1 == "1") {
alert("2");
}
That's why it's appearing twice.
You can write the program as:
let number1 = parseInt(prompt("Input the first number"));
let op = prompt("Input the operator");
let number2 = parseInt(prompt("Input the second number"));
if (op == '+')
alert(number1 + number2);
else if (op == '-')
alert(number1 - number2);
else if (op == '*')
alert(number1 * number2);
else if (op == '/')
alert(number1 / number2);
else
alert("Please enter a valid operator");
Here we used parseInt(), that returns the first integer from a string.
I'm making a puzzle game where the user uses WASD to move a character up, left, down, right respectively. It works fine at the moment but I was wondering if there was a way to break the code down into more intuitive functions. Below is my code:
function move(e)
{
for (var y = 0; y < mapHeight; y++) {
for (var x = 0; x < mapWidth; x++) {
if (map[y][x] == "#" || map[y][x] == "+") {
break;
}
}
if (map[y][x] == "#" || map[y][x] == "+") {
break;
}
}
var player_x = x;
var player_y = y;
if (e.key == 'w') {
var player_new_x = player_x;
var player_new_y = player_y - 1;
if (moveBox(player_new_x, player_new_y, "up") === false) {
return;
}
if (map[player_new_y][player_new_x] == " " ||
map[player_new_y][player_new_x] == ".") {
if (map[player_new_y][player_new_x] == " ") {
map[player_new_y][player_new_x] = "#";
} else if (map[player_new_y][player_new_x] == ".") {
map[player_new_y][player_new_x] = "+";
}
if (map[player_y][player_x] == "#") {
map[player_y][player_x] = " ";
} else if (map[player_y][player_x] == "+") {
map[player_y][player_x] = ".";
}
}
} else if (e.key == 's') {
var player_new_x = player_x;
var player_new_y = player_y + 1;
if (moveBox(player_new_x, player_new_y, "down") === false) {
return;
}
if (map[player_new_y][player_new_x] == " " ||
map[player_new_y][player_new_x] == ".") {
if (map[player_new_y][player_new_x] == " ") {
map[player_new_y][player_new_x] = "#";
} else if (map[player_new_y][player_new_x] == ".") {
map[player_new_y][player_new_x] = "+";
}
if (map[player_y][player_x] == "#") {
map[player_y][player_x] = " ";
} else if (map[player_y][player_x] == "+") {
map[player_y][player_x] = ".";
}
}
} else if (e.key == 'a') {
var player_new_x = player_x - 1;
var player_new_y = player_y;
if (moveBox(player_new_x, player_new_y, "left") === false) {
return;
}
if (map[player_new_y][player_new_x] == " " ||
map[player_new_y][player_new_x] == ".") {
if (map[player_new_y][player_new_x] == " ") {
map[player_new_y][player_new_x] = "#";
} else if (map[player_new_y][player_new_x] == ".") {
map[player_new_y][player_new_x] = "+";
}
if (map[player_y][player_x] == "#") {
map[player_y][player_x] = " ";
} else if (map[player_y][player_x] == "+") {
map[player_y][player_x] = ".";
}
}
} else if (e.key == 'd') {
var player_new_x = player_x + 1;
var player_new_y = player_y;
if (moveBox(player_new_x, player_new_y, "right") === false) {
return;
}
if (map[player_new_y][player_new_x] == " " ||
map[player_new_y][player_new_x] == ".") {
if (map[player_new_y][player_new_x] == " ") {
map[player_new_y][player_new_x] = "#";
} else if (map[player_new_y][player_new_x] == ".") {
map[player_new_y][player_new_x] = "+";
}
if (map[player_y][player_x] == "#") {
map[player_y][player_x] = " ";
} else if (map[player_y][player_x] == "+") {
map[player_y][player_x] = ".";
}
}
} else {
return;
}
render();
}
Is it possible to make four functions, one for each of the movement keys? Any help would be much appreciated
Yes
It´s possible to do what you want, 4 different functions
But ... you should intercept the events keydown (when the user presses the key) and keyup (when the user releases the key)
As long as the key is "pressed" you do the movement
You can create an object like this
let move = { moveH : 0 , moveV :0 }
When the keydown event is detected for "a" -> {moveH : -1, moveV :0}
"s" -> { moveH :0 , moveV :1 }
"w" -> { moveH :0 , moveV :-1 }
"d" -> { moveH :1 , moveV :0 }
When the keyup event is detected .. for any key -> {moveH :0 , moveV:0 }
Meanwhile
apply the move to the object on the screen
something like
stuff.position = { x : stuff.position.x + move.moveH , y: stuff.position.y + move.moveV }
I'm trying to get the quiz to loop 5 times while recording the correct answer for each question before returning to start menu but I'm struggling to get it working
Any help with this will be much appreciated.
function cleartxt()
{
setTimeout("document.getElementById('ans').innerHTML = ''", 3000);
}
var random = new Array(5);
var count = 0;
function next()
{
var store = 0;
do
{
store = (Math.round(Math.ceil(Math.random() * 40) -1));
}while(random.indexOf(store) > -1);
document.getElementById("ques").innerHTML = questions[store][0];
document.getElementById("rad1").innerHTML = questions[store][1];
document.getElementById("rad2").innerHTML = questions[store][2];
document.getElementById("rad3").innerHTML = questions[store][3];
document.getElementById("rad4").innerHTML = questions[store][4];
document.getElementById("image").src = images[store];
var radio = document.getElementsByName("rad");
while(store <= 5)
{
count++;
if(store == 5)
startMenu();
if(radio[0].checked == true)
{
if(questions[store][0] == questions[store][5])
document.getElementById("ans").innerHTML = "Correct";
else
document.getElementById("ans").innerHTML = "Incorrect";
}
else if(radio[1].checked == true)
{
if(questions[store][1] == questions[store][5])
document.getElementById("ans").innerHTML = "Correct";
else
document.getElementById("ans").innerHTML = "Incorrect";
}
else if(radio[2].checked == true)
{
if(questions[store][2] == questions[store][5])
document.getElementById("ans").innerHTML = "Correct";
else
document.getElementById("ans").innerHTML = "Incorrect";
}
else if(radio[3].checked == true)
{
if(questions[store][3] == questions[store][5])
document.getElementById("ans").innerHTML = "Correct";
else
document.getElementById("ans").innerHTML = "Incorrect";
}
else
document.getElementById("ans").innerHTML = "Please select an answer!";
}
}
function startMenu()
{
window.history.back();
}
var ticketType;
ticketType = prompt("What sort of tickets would you like");
document.write("Ticket Type Cost is: " + ticketType);
document.write("<br/>");
if (ticketType == "A") {
document.write("$100");
}
else if (ticketType == "a") {
document.write("$100");
}
else if (ticketType == "B") {
document.write("$75");
}
else if (ticketType == "b") {
document.write("$75");
}
else if (ticketType == "C") {
document.write("$50");
}
else if (ticketType == "c") {
document.write("$50");
}
else {
document.write("Invalid ticket type");
}
var ticketQty;
ticketQty = prompt("How many tickeets would you like");
var ticketQty = parseInt(ticketQty);
document.write("<br/>");
document.write("Ticket Qty is: " + ticketQty);
document.write("<br/>");
if (ticketQty < 0 || ticketQty > 100) {
document.write("Invalid Qty");
}
var ticketPrice = ;
if (ticketPrice > 0 && ticketQty > 0 && ticketQty < 100) {
document.write("Ticket payment required is:$" + (ticketPrice*ticketQty));
}
I need help with this last variable 'ticketPrice'. I have tried a lot of different things but none of them seem to work. What should I set my ticketPrice variable to and do i need to add anything else to my code or remove anything in order to make it work properly.
You would want to set the ticketPrice variable inside your if statements when you know the price. So you should define the var ticketPrice at the top and in each if statement where you are doing document.write also assign the variable.
var ticketType;
var ticketPrice;
ticketType = prompt("What sort of tickets would you like");
document.write("Ticket Type Cost is: " + ticketType);
document.write("<br/>");
if (ticketType == "A") {
document.write("$100");
ticketPrice = 100;
}
else if (ticketType == "a") {
document.write("$100");
ticketPrice = 100;
}
else if (ticketType == "B") {
document.write("$75");
ticketPrice = 75;
}
else if (ticketType == "b") {
document.write("$75");
ticketPrice = 75;
}
else if (ticketType == "C") {
document.write("$50");
ticketPrice = 50;
}
else if (ticketType == "c") {
document.write("$50");
ticketPrice = 50;
}
else {
document.write("Invalid ticket type");
}
var ticketQty;
ticketQty = prompt("How many tickeets would you like");
var ticketQty = parseInt(ticketQty);
document.write("<br/>");
document.write("Ticket Qty is: " + ticketQty);
document.write("<br/>");
if (ticketQty < 0 || ticketQty > 100) {
document.write("Invalid Qty");
}
if (ticketPrice > 0 && ticketQty > 0 && ticketQty < 100) {
document.write("Ticket payment required is:$"
+ (ticketPrice*ticketQty));
}
You should also consider refactoring this to reduce some of the duplication around your if statements
if (ticketType == "A") {
document.write("$100");
ticketPrice = 100;
}
else if (ticketType == "a") {
document.write("$100");
ticketPrice = 100;
}
else if (ticketType == "B") {
document.write("$75");
ticketPrice = 75;
}
else if (ticketType == "b") {
document.write("$75");
ticketPrice = 75;
}
else if (ticketType == "C") {
document.write("$50");
ticketPrice = 50;
}
else if (ticketType == "c") {
document.write("$50");
ticketPrice = 50;
}
else {
document.write("Invalid ticket type");
}
Could become
if (ticketType.toLowerCase() === "a") {
document.write("$100");
ticketPrice = 100;
} else if (ticketType.toLowerCase() === "b") {
document.write("$75");
ticketPrice = 75;
} else if (ticketType.toLowerCase() === "c") {
document.write("$50");
ticketPrice = 50;
} else {
document.write("Invalid ticket type");
}
Reducing duplication here would make it slightly easier to update the prices of your tickets for example as you wouldn't need to change it in 2 places (the uppercase and lowercase blocks)
Change ticketPrice = ; to ticketPrice; as it produce error.
var ticketType;
ticketType = prompt("What sort of tickets would you like");
document.write("Ticket Type Cost is: " + ticketType);
document.write("<br/>");
if (ticketType == "A") {
document.write("$100");
}
else if (ticketType == "a") {
document.write("$100");
}
else if (ticketType == "B") {
document.write("$75");
}
else if (ticketType == "b") {
document.write("$75");
}
else if (ticketType == "C") {
document.write("$50");
}
else if (ticketType == "c") {
document.write("$50");
}
else {
document.write("Invalid ticket type");
}
var ticketQty;
ticketQty = prompt("How many tickeets would you like");
var ticketQty = parseInt(ticketQty);
document.write("<br/>");
document.write("Ticket Qty is: " + ticketQty);
document.write("<br/>");
if (ticketQty < 0 || ticketQty > 100) {
document.write("Invalid Qty");
}
var ticketPrice;
if (ticketPrice > 0 && ticketQty > 0 && ticketQty < 100) {
document.write("Ticket payment required is:$" + (ticketPrice*ticketQty));
}
Assign the value for ticketPrice in your set of if statements, and declare it ahead of time.
var ticketType;
var ticketPrice;
ticketType = prompt("What sort of tickets would you like");
document.write("Ticket Type Cost is: " + ticketType);
document.write("<br/>");
if (ticketType == "A") {
ticketPrice=100;
}
else if (ticketType == "a") {
ticketPrice=100;
}
else if (ticketType == "B") {
ticketPrice=75;
}
else if (ticketType == "b") {
ticketPrice=$75;
}
else if (ticketType == "C") {
ticketPrice=50;
}
else if (ticketType == "c") {
ticketPrice=50;
}
else {
document.write("Invalid ticket type");
}
if (typeof ticketPrice !== "undefined" && ticketPrice !== null)
{
document.write("$");
document.write(ticketPrice);
}
var ticketQty;
ticketQty = prompt("How many tickeets would you like");
var ticketQty = parseInt(ticketQty);
document.write("<br/>");
document.write("Ticket Qty is: " + ticketQty);
document.write("<br/>");
if (ticketQty < 0 || ticketQty > 100) {
document.write("Invalid Qty");
}
var ticketPrice = ;
if (ticketPrice > 0 && ticketQty > 0 && ticketQty < 100) {
document.write("Ticket payment required is:$" + (ticketPrice*ticketQty));
}
I have this jquery scripts. I want to use the return value from the function stockArt() into function prod_actname(). It seems i'm missing something or my implementation is wrong. How could i possibly do that?
Another scenario is when StockArt() value is changed the Activity Name must be updated also.
Say Stock Art Color is green. and the Activity Name color also be updated to color green, without selecting the color green from prod_actname() function. It will automatically be change as the StockArt color is also change. They must be in the same color.
jQuery( document ).ready(function($) {
$('#preview_design').css("background-color","black");
$('#stock_art').change(function() {
var retVal = stockArt();
$('#prod_actname').data("stockData", retVal);
});
$('#prod_actname').change(function() {
var stockData = $('#prod_actname').data("stockData");
prod_actname(stockData);
});
function stockArt()
{
var returnValue = null;
var selectStock_Art = $('#stock_art :selected').val();
if(selectStock_Art == '31145-RB-emb')
{ // green
$('#stockArt_img').removeClass().addClass('stock_art_grbg1');
}
else if(selectStock_Art == '33441-RB-emb1')
{ // yellow
$('#stockArt_img').removeClass().addClass('stock_art_yebg2');
}
else if(selectStock_Art == '33441-RB-emb2')
{ // gold
$('#stockArt_img').removeClass().addClass('stock_art_gobg3');
}
else {
$('#stockArt_img').removeClass();
}
returnValue = selectStock_Art;
return returnValue;
}
function prod_actname(stockData){
var StockArtResult = stockData;
//User stockData as needed
// assign the value to a variable, so you can test to see if it is working
var selectActivity_Name = $('#prod_actname :selected').val();
//alert(selectActivity_Name);
if(selectActivity_Name == 'Baseball')
{
$('#activityName_img').removeClass();
if(stockArtValue == '31145-RB-emb'){
$('#activityName_img').addClass('activity_name_GRbg1');
}
else if(stockArtValue == '33441-RB-emb1'){
$('#activityName_img').addClass('activity_name_YEbg1');
}else if(stockArtValue == '33441-RB-emb2') {
$('#activityName_img').addClass('activity_name_GObg1');
}
}
else if(selectActivity_Name == 'Basketball')
{
$('#activityName_img').removeClass();
if(stockArtValue == '31145-RB-emb'){
$('#activityName_img').addClass('activity_name_GRbg2');
}
else if(stockArtValue == '33441-RB-emb1'){
$('#activityName_img').addClass('activity_name_YEbg2');
}else if(stockArtValue == '33441-RB-emb2') {
$('#activityName_img').addClass('activity_name_GObg2');
}
}
else if(selectActivity_Name == 'Boys Basketball')
{
$('#activityName_img').removeClass();
if(stockArtValue == '31145-RB-emb'){
$('#activityName_img').addClass('activity_name_GRbg3');
}
else if(stockArtValue == '33441-RB-emb1'){
$('#activityName_img').addClass('activity_name_YEbg3');
}else if(stockArtValue == '33441-RB-emb2') {
$('#activityName_img').addClass('activity_name_GObg3');
}
}
else if(selectActivity_Name == 'Girls Basketball')
{
$('#activityName_img').removeClass();
if(selectStock_Art == '31145-RB-emb'){
$('#activityName_img').addClass('activity_name_GRbg4');
}
else if(selectStock_Art == '33441-RB-emb1'){
$('#activityName_img').addClass('activity_name_YEbg4');
}else if(selectStock_Art == '33441-RB-emb2') {
$('#activityName_img').addClass('activity_name_GObg4');
}
}
}
});
Use data attributes to store data for '#prod_actname' and later access it.
You can leverage jQuery.data for this.
Try this
jQuery( document ).ready(function($) {
$('#preview_design').css("background-color","black");
$('#stock_art').change(function() {
var retVal = stockArt();
$('#prod_actname').data("stockData", retVal);
});
$('#prod_actname').change(function() {
var stockData = $('#prod_actname').data("stockData");
prod_actname(stockData);
});
function stockArt()
{
var returnValue = null;
var selectStock_Art = $('#stock_art :selected').val();
if(selectStock_Art == '31145-RB-emb')
{ // green
$('#stockArt_img').removeClass().addClass('stock_art_grbg1');
}
else if(selectStock_Art == '33441-RB-emb1')
{ // yellow
$('#stockArt_img').removeClass().addClass('stock_art_yebg2');
}
else if(selectStock_Art == '33441-RB-emb2')
{ // gold
$('#stockArt_img').removeClass().addClass('stock_art_gobg3');
}
else {
$('#stockArt_img').removeClass();
}
returnValue = selectStock_Art;
return returnValue;
}
var stockArtValue = stockArt();
function prod_actname(stockData){
//User stockData as needed
// assign the value to a variable, so you can test to see if it is working
var selectActivity_Name = $('#prod_actname :selected').val();
//alert(selectActivity_Name);
if(selectActivity_Name == 'Baseball')
{
$('#activityName_img').removeClass();
if(stockArtValue == '31145-RB-emb'){
$('#activityName_img').addClass('activity_name_GRbg1');
}
else if(stockArtValue == '33441-RB-emb1'){
$('#activityName_img').addClass('activity_name_YEbg1');
}else if(stockArtValue == '33441-RB-emb2') {
$('#activityName_img').addClass('activity_name_GObg1');
}
}
else if(selectActivity_Name == 'Basketball')
{
$('#activityName_img').removeClass();
if(stockArtValue == '31145-RB-emb'){
$('#activityName_img').addClass('activity_name_GRbg2');
}
else if(stockArtValue == '33441-RB-emb1'){
$('#activityName_img').addClass('activity_name_YEbg2');
}else if(stockArtValue == '33441-RB-emb2') {
$('#activityName_img').addClass('activity_name_GObg2');
}
}
else if(selectActivity_Name == 'Boys Basketball')
{
$('#activityName_img').removeClass();
if(stockArtValue == '31145-RB-emb'){
$('#activityName_img').addClass('activity_name_GRbg3');
}
else if(stockArtValue == '33441-RB-emb1'){
$('#activityName_img').addClass('activity_name_YEbg3');
}else if(stockArtValue == '33441-RB-emb2') {
$('#activityName_img').addClass('activity_name_GObg3');
}
}
else if(selectActivity_Name == 'Girls Basketball')
{
$('#activityName_img').removeClass();
if(selectStock_Art == '31145-RB-emb'){
$('#activityName_img').addClass('activity_name_GRbg4');
}
else if(selectStock_Art == '33441-RB-emb1'){
$('#activityName_img').addClass('activity_name_YEbg4');
}else if(selectStock_Art == '33441-RB-emb2') {
$('#activityName_img').addClass('activity_name_GObg4');
}
}
}
});
One way is to store the output of the stockArt() in a variable and then pass that as an argument to the prod_actname(). For this, you would need to modify the function signature of the prod_actname() function to accept an argument. Something like this
var stockArtValue;
$('#stock_art').change(function() {
stockArtValue = stockArt();
});
$('#prod_actname').change(function() {
prod_actname(stockArtValue);
});
function prod_actname(val){
....
}
For some cases, it might be useful to consider that the stockArtValue variable has indeed been changed. You can typically use another state variable to indicate. Alternatively, if you know the set of likely input values, then you initialize it with a value outside of that input value set and check against it.
You could save its value in a property...
jQuery( document ).ready(function($) {
var StockArtResult = null;
$('#stock_art').change(function() {
StockArtResult = stockArt();
});
$('#prod_actname').change(function() {
if(StockArtResult != null)
{
prod_actname(StockArtResult);
}
});
});