How to Update a Variable After Button Click

Change variable value on button click

You have just a couple of problems with your code. The first is this:

if (beast = "yes") {

In this case, you're assigning "yes" to beast, not comparing it. Change it to

if (beast == "yes") {

Next, your code at the bottom (if (beast == "yes") { ...) is only run at the start. Instead, you want that code to run whenever the variable is updated. Move it into your imageAdd function or somewhere else where you update the UI then call it from imageAdd. While you're at it, remove that imagemap function declaration. It doesn't make sense to declare a function inside of an if statement.

var beast;
function imageAdd(choice) {
beast = choice;
updateUI();
}

function updateUI() {
if (beast == "yes") {
document.getElementById('test1').innerHTML += '<img> an image map goes here';
}
}

How to keep updating value of a variable by clicking on a button in JavaScript after it was entered in INPUT first?

You could use the input field's event to update the cached value and update it on button click.

const input = document.getElementById('input'),
button = document.getElementById('button'),
output = document.getElementById('output');
let value = input.valueAsNumber;

input.oninput = function () {
value = this.valueAsNumber;
};

button.onclick = function () {
value += 5;
output.textContent = isNaN(value) ? '' : value;
};
<input type="number" id="input" />
<button id="button">Calculate</button>
<p id="output"></p>

How to change change value of variable every time when I click on button

Please check following example

var x = 10
var y = 20
var xLeft=0
var yTop=0

function clickFunction() {
xLeft += x + 30
yTop += y + 22

console.log("xLeft :" + xLeft)
console.log("yTop :" + yTop)
}
<!DOCTYPE html>
<html>
<body>

<button type="button" onclick="clickFunction()">Click Me!</button>

</body>
</html>

Change the value of variable on button click

I dont see you setting the myLoc object anywhere. You are just assigning value for lat, lng. Check the snippet below to see if it answers your question.

Here, you initiliaze myLoc and on button click get new values for lat, lng and set it at the end again for myLoc

//just a temp function to show the example. Dont add this in your codevar L = {  LatLng: function(lat, lng) {    console.log("Current Values for Lat, Lng: " + lat + " , "+ lng);  }}

let myloc = new L.LatLng(13, 100);//var map = L.map('map').setView(myloc, 12);
$(function () { $('.btn-a').on('click', function(e){ // e.preventDefault(); var clsName = $(this).val(); var lat, long;
if (clsName == 'First') { lat = 13; long = 100; } else if(clasName = 'Second') { lat = 14; long = 101; } //set the myloc here myloc = new L.LatLng(lat, long); //then map again //L.map('map').setView(myloc, 12) })});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script><div class="row">    <input type="button" id="btn-first" class="btn-a" value = "First">    <input type="button" id="btn-second" class="btn-a" value = "Second"></div>


Related Topics



Leave a reply



Submit