We Keep Coding

Go to next page when True

JavaScript was created as follows: If the diction value is true, I want to go to another page, and if it is false, I want to let you go to Home. What should I do?
async function predict() {
// predict can take in an image, video or canvas html element
var image = document.getElementById("face-image")
const prediction = await model.predict(image, false);
prediction.sort((a,b) => parseFloat(b.probability) - parseFloat(a.probability));
switch (prediction[0].className){
case "True":
resultMessege = "성공"
break;
case "False":
resultMessege = "실패."
break;
default:
resultMessege = "알 수 없는 오류가 발생하였습니다. 다시 시도해보시길 바랍니다."
}
$('.result-message').html(resultMessege);

If redirecting to another page is, what you want to achive, then it is simpy this:
window.location.href = '/nextpage';

Have image display on mouse over text, delay with hide or hide immediately if mouseover new text

So I have so an image will show when certain text is moused over, it will delay when the mouse is taken off before disappearing and that works just fine. But I have multiple images that can show up depending on the text hovered, I want to have the first image skip it's delay if other text is moused over so it doesn't expand the page and stack the images. Is this possible? Or will I just need to pull the delay off? This is done within JQuery
$("h2").mouseover(function ()
{
let mouseText = $(this).attr("class").split(" ")[0];
switch(mouseText)
{
case "wh-light":
imgID += mouseText;
break;
case "wh-hl-ll":
imgID += mouseText;
break;
case "part-hh-ll":
imgID += mouseText;
break;
}
$(imgID).show();
});
$("h2").mouseout(function ()
{
$(imgID).delay(1000).hide(0);
});
I can supply the HTML but I don't think it is too relevant to this. Thank you in advance for your help!

Without having your template and complete code, I'd have to contrive a full example... but the below snippet should give you a good example of what you'll have to do. You'll need to keep track of the current image and your callback has to know what the current image was when the delay was kicked off and compare it to the current to know whether it should do anything or not.
For this reason I pulled the code into separate javascript functions and used setTimeout instead of the jquery delay(). The documentation on the actual jquery site even mentions that the delay function is limited and has no way to cancel itself and as such should not be treated as a replacement for setTimeout().
Ref https://api.jquery.com/delay/
The .delay() method is best for delaying between queued jQuery effects. Because it is limited—it doesn't, for example, offer a way to cancel the delay—.delay() is not a replacement for JavaScript's native setTimeout function, which may be more appropriate for certain use cases.
Without knowing how you were building the imgID variable or clearing it out... I added the baseImageID and targetImageID variables so that you don't end up just continuously concatenating the new strings onto the end of imgID...
As a last note... I like to make things very modular and verbose when talking through a solution so please dont hate on the extra functions... I think they make the solution easier to understand. The actual implementation can be streamlined...
let baseImageID = 'image-';
let targetImageID = '';
let currentImageID = '';
const hideImageNow = function(imageID) {
$(imageID).hide();
if (currentImageID == imageID) {
currentImageID = '';
}
};
const hideImageLater = function(imageID, delay) {
setTimeout(hideImageNow, delay, imageID);
};
const showImage = function(imageID) {
if (currentImageID != '') {
hideImageNow(currentImageID);
}
currentImageID = imageID;
$(imageID).show();
};
$("h2").mouseover(function() {
targetImageID = baseImageID;
let mouseText = $(this).attr("class").split(" ")[0];
switch (mouseText) {
case "wh-light":
targetImageID += mouseText;
break;
case "wh-hl-ll":
targetImageID += mouseText;
break;
case "part-hh-ll":
targetImageID += mouseText;
break;
}
showImage(targetImageID);
});
$("h2").mouseout(function() {
hideImageLater(currentImageID, 1000);
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

Difficulty constructing Absolute URL

www.baxter.com source page, shows most of the href links starting with the word baxter, like this -
href="/baxter/corporate.page?">About Baxter<
So the way I can construct an absolute url from the above is by combining the base url, www.baxter.com and the relative url /baxter/corporate.page?giving me www.baxter.com/baxter/corporate.page? which results in 404, cause the actual url is www.baxter.com/corporate.page?
I know how to generally parse relative URLs in PHP but is there a way to sense and remove words from relative urls like these?
Also mouseover on About Baxter on www.baxter.com web page displays the correct url, www.baxter.com/corporate.page? at bottom left of the page - where is this coming from? can it be accessed?
Will deeply appreciate any help/pointers...
EDIT on Nov 7:
In main.js, they are removing /baxter:
var fixer = function() {
var init = function() {
var digitasFinder = /(proto)|(cms-)|(teamsite-)/
, baxterFinder = /(\/baxter\/)/
, $allAnchors = $("a")
, $allForms = $("form");
digitasFinder.test(location.host) || ($allAnchors.each(function() {
var $this = $(this)
, actualHref = $this.attr("href");
if (baxterFinder.test(actualHref)) {
var newHref = actualHref.replace(baxterFinder, "/");
$this.attr("href", newHref)
}
}
),
$allForms.each(function() {
var $this = $(this)
, actualAction = $this.attr("action");
if (baxterFinder.test(actualAction)) {
var newAction = actualAction.replace(baxterFinder, "/");
$this.attr("action", newAction)
}
}
))
}
;
return {
init: init
}
}

Looks like some JavaScript executed on page load is modifying the hrefs of the links.
You could try duplicating the effects of the JS code (ie. remove '/baxter' from the links), or for a more generic solution, you could use a headless browser to execute the JS code and then evaluate the resulting DOM. Look into the Mink project for a PHP-based solution.

localStorage, options data in selectmenu disappear when changing page

I have this code that writes entered phone numbers into defined options of a selectmenu, the problem is when i go back or quit the app the data are deleted and the list is empty. I can't find out why and how to fix this...
var flag_beneficiary_account_number=false;
var beneficiary_account_number;
if ( $('#beneficiary_number').val().length > 2 ) {
beneficiary_account_number=$('#beneficiary_number').val();
flag_beneficiary_account_number=true;
} else {
beneficiary_account_number = $('#Beneficiary_number_select').find(":selected").html();
flag_beneficiary_account_number=false;
}
if(flag_beneficiary_account_number){
if(localStorage.getItem("Beneficiary_number_select1")!=beneficiary_account_number &&
localStorage.getItem("Beneficiary_number_select2")!=beneficiary_account_number &&
localStorage.getItem("Beneficiary_number_select3")!=beneficiary_account_number){
var select_counter = parseInt(localStorage.getItem("select-counter"));
var select_option = select_counter%3;
select_counter = select_counter+1;
localStorage.setItem("select-counter",select_counter);
switch (select_option){
case 0:
localStorage.setItem("Beneficiary_number_select1",beneficiary_account_number);
$('#Beneficiary_number_select1').val(beneficiary_account_number);
$('#Beneficiary_number_select1').html(beneficiary_account_number);
break;
case 1:
localStorage.setItem("Beneficiary_number_select2",beneficiary_account_number);
$('#Beneficiary_number_select2').val(beneficiary_account_number);
$('#Beneficiary_number_select2').html(beneficiary_account_number);
break;
case 2:
localStorage.setItem("Beneficiary_number_select3",beneficiary_account_number);
$('#Beneficiary_number_select3').val(beneficiary_account_number);
$('#Beneficiary_number_select3').html(beneficiary_account_number);
break;
default:
break;
}
}
}

I was editing your question when you finally added the cordova tag. Things became clear so you need to remember that in cordova, to get the localStorage to work, use it this way
// To store
window.localStorage.setItem("Beneficiary_number_select2", beneficiary_account_number);
//and to access the value, use
window.localStorage.localStorage
.getItem("Beneficiary_number_select2");
instead localStorage.getItem("Beneficiary_number_select2")

backgroundColor change JavaScript

I want to target this:
<h3 id='month'>Oct</h3>
I did this:
var changeColor = function () {
var monName = new Array ('Jan' ... 'Dec'); //ellipsis to make code short
var now = new Date();
if(monName == monName[now.getMonth()]) {
switch(monName) {
case 'Jan':
document.getElementById('month').style.backgroundColor = '#ff3300';
break;
.
.
.
.
case 'Dec':
document.getElementById('month').style.backgroundColor = '#c2dd8a';
break;
default:
alert('Error');
}
}
};
I called the function in the html body element (external js file between script tags properly sourced already):
<script type='text/javascript' src='time.js'></script>
<body onload='changeColor();'>
It didn't seem to work. I'm suspecting there is an error with how I target the h3 element. My overall idea is to change the background color as the month changes for the targeted element. Any help is greatly appreciated. Thanks!

Try to change your if statement to:
if(document.getElementById('month').innerHTML == monName[now.getMonth()])
Also, your switch statement should be:
switch(monName[now.getMonth()])

I would remove the if test completely.