My problem is, is that the numpad's "/" key triggers the search bar in Firefox. I would like to prevent this from happening.
I'm currently working on an online Calculator, and ran into the problem described earlier. The reason why I would like this not to happen, is because you obviousely can't type in a division thanks to this feature. The page is only meant to run in Firefox, and it's just a little help for my little brother, so it doesnÄt have to be the most professional solution - if it works, it's fine. I've already tried the preventDefault method, but that doesn't change anything.
Any help is appreciated!
(Sorry if this question was already asked before, or it doesn't append to the rules, I'm totally new to StackOverflow)
window.addEventListener("keyup", function (event) {
let signs = ["*", "-", "/", "+"];
event.key.preventDefault;
if (!(isNaN(event.key)) || signs.includes(event.key)) output.value += event.key;
else if (event.keyCode === 8) {
output.value = output.value.slice(0, -1);
}
})
//This is a snippet of my code right now, but the event.key.preventDefault part doesn't work for my problem
I think you should use preventDefault like this:
event.preventDefault();
I don't know whether this will block the search box or not, but you can call preventDefault like this.
Related
I'm sorry if that question is obvious to solve, but I don't know JavaScript yet but feels like it's the only way to implement what my clients need for their website.
I want to redirect users with specific browser to the specific simplified page once they visit homepage and keep this redirection work everytime they click on homepage button. Basically what I want is a 301 redirect based on user-agent. I've tried many times but all I've got was an infinte redirection loop or no result at all.
function get_ya_browser(){
var ua = navigator.userAgent;
if (ua.search(/YaBrowser/) > 0) document.location.href='redirect-link.html';
return '';
}
How could I change this code to work? Would really appreciate any help.
Try - document.location.replace ='redirect-link.html';
instead of document.location.href ='redirect-link.html';
.location.replace() simulates a HTTP redirect
.location.href() simulates a mouseclick
If the code was part of redirect-link.html && ua.search(/YaBrowser/) !== -1, you will get an infinite loop.
following code solved this problem:
function get_ya_browser(){
var ua = navigator.userAgent;
if (ua.search(/YaBrowser/) !== -1 && !location.href.includes('elbrus-m-zakaz.ru/home-page-windows-xp/')) {
document.location.href='//elbrus-m-zakaz.ru/home-page-windows-xp/';
}
}
I kind of get all my coding information from the internet rather than a class, and certain answers I can't really understand so hopefully I'll get a simple answer to a possibly stupid question.
In a part of my website, I've got a button which brings up a window.prompt and it asks the viewer if they would like to go to one page (I've called it Timeline because it's a timeline of my art portfolio) or to the other. The prompt works perfectly fine, and I attempted to code it so that if, for example, the user typed in "Timeline" the webpage would automatically redirect them to the Timeline page (which for me is empty at the moment) and vice versa if they typed in "Term 1" (the name of the other page.) I found out about window.location.replace and assumed that it would work if I tried to get it to redirect the user, but when I run my webpage nothing happens after I type in the prompt window. I checked the Developer Tools on Chrome and it didn't report any errors, so is it just me typing some stuff wrong?
function promptFunction() {
var choice = window.prompt ("Would you like to go to the Timeline or to Term 1?")
if (choice === "Timeline")
function redirTime() {
window.location.replace() ("Timeline.html");
}
else if (choice ==="timeline")
function redirTime() {
window.location.replace() ("Timeline.html");
}
else if (choice ==="Term 1")
function redirFirstTerm() {
window.location.replace() ("Term 1.html")
}
else if (choice ==="term 1")
function redirFirstTerm() {
window.location.replace() ("Term 1.html")
}
};
This again is probably me looking for an answer that's right under my nose, so if the answer is something obvious, sorry ^^'
Edit: I've got an answer now; thank you very much! (I did think it was something to do with the way I was typing it, sorry)
The code you posted creates, based on choice a function, but the function is never executed (or you omitted this code).
Additionally the window.location.replace()("...") part is wrong. It calls the replace function on window.location with no arguments and uses the result of this function call again as function an passes e.g. "Timeline.html" as argument.
If all you want to do is setting the location, assign it directly, e.g. window.location = "https://stackoverflow.com" or in your case window.location.href = "Timeline.html" (see https://developer.mozilla.org/en-US/docs/Web/API/Window/location).
Most web developers know that to restrict only numbers to a form input, you can do something like this:
$(function() {
$("#foobar").keypress(function(e) {
if($.inArray(e.which, range(48, 57)) == -1) {
e.preventDefault();
return false;
}
});
});
function range(start, end) {
var range = [];
for(var i = start; i <= end; i++) {
range.push(i);
}
return range;
}
Unfortunately, this does not quite get the job done on an Android with the default browser. (iPhone and Other Android browsers have not been tested, so they could suffer from the same issue. Tested on an iPhone 4S, which did not have this issue.)
On an Android, let's say you first type "f". Nothing happens. Awesome. Wait just a minute. You then type "a". What happens? The "f" is put into the input field! You type "c", the "a" is put into the field. And so on. Whatever the previously-entered character is, that's what's put into the field.
Here's a jsFiddle that demonstrates the issue.
The fiddle works fine on a desktop, but try it on Android (phone or emulator). I've tested with Android 2.3.6 and 2.2.
Anyone run into this before? Any direction would be greatly appreciated! For now, the workaround is to remove non-numeric characters immediately afterwards (in the keyup event).
Update: Here is a fiddle that shows that preventDefault() is being reached. The problem seems to be that rather than preventing, it's simply delaying (until the next event).
A completely different approach would be using <input type="number"> and relying on the browser to provide the appropriate interface/filtering (which mobile browsers are prone to). It does not fix the code, but should circumvent the problem, which looks like a bug, to be honest.
A wild guess: Maybe Androids register the input at the keydown stage. You could try both events.
Ok I played with this a bit and this is running fine on my andriod:
var reserved = [0,8]
$(function()
{
$("#foobar").keypress(function(e)
{
if($.inArray(e.which, reserved) < 0 && ((e.which < 48) || (e.which > 57)))
{
e.preventDefault();
return false;
}
});
});
http://jsfiddle.net/HW794/1/embedded/result/
Possible that droid does not like the call to the fn? (range)
function convertDateFormat(){
// alert("hi");
$(".tour-dates ul li").each(function(){
// alert(monthConvert($(this).find(".month").text()));
var replace = monthConvert($(this).find(".month").text());
$(this).find(".month").text(replace);
});
}
I have the above function in a js file and i'm calling it from $(document).ready(function(){...
you can see i have two alert statements that are commented.
if they are commented the function doesn't seem to be called because the changes aren't reflected.
If i remove the comment and let the alert work, the changes appear!
What am I doing wrong?
FYI:
The monthConvert function:
function monthConvert(monthInt){
var monthArray = new Array();
monthArray["1"]="JAN";
monthArray["2"]="FEB";
monthArray["3"]="MAR";
monthArray["4"]="APR";
monthArray["5"]="MAY";
monthArray["6"]="JUN";
monthArray["7"]="JUL";
monthArray["8"]="AUG";
monthArray["9"]="SEP";
monthArray["10"]="OCT";
monthArray["11"]="NOV";
monthArray["12"]="DEC";
return monthArray[monthInt];
}
Perhaps you could check your browsers JavaScript logs for errors.
In Internet Explorer 9 press F12
In Firefox download firebug.
In Chrome press CTRL + SHIFT + J
It's hard to know exactly what's going on without seeing the complete HTML, but a minimal test case from your code above seems to work, with or without the alerts: http://jsfiddle.net/g_thom/5ChNh/
So, your problems seem to lie elsewhere than the code so far provided.
Your Javascript file is cached by browser. Just disable the cache or Press Ctrl + F5 to refresh page.
I've written a userscript for Gmail : Pimp.my.Gmail & i'd like it to be compatible with Google Chrome too.
Now i have tried a couple of things, to the best of my Javascript knowledge (which is very weak) & have been successful up-to a certain extent, though im not sure if it's the right way.
Here's what i tried, to make it work in Chrome:
The very first thing i found is that contentWindow.document doesn't work in chrome, so i tried contentDocument, which works.
BUT i noticed one thing, checking the console messages in Firefox and Chrome, i saw that the script gets executed multiple times in Firefox whereas in Chrome it just executes once!
So i had to abandon the window.addEventListener('load', init, false); line and replace it with window.setTimeout(init, 5000); and i'm not sure if this is a good idea.
The other thing i tried is keeping the window.addEventListener('load', init, false); line and using window.setTimeout(init, 1000); inside init() in case the canvasframe is not found.
So please do lemme know what would be the best way to make this script cross-browser compatible.
Oh and im all ears for making this script better/efficient code wise (which im sure is possible)
edit: no help...? :'(
edit 28-Apr:
i re-wrote the code a little and now it looks something like this.:
if(document.location != top.location) return;
(function() {
var interval = window.setInterval(waitforiframe, 3000);
var canvas;
function waitforiframe() {
console.log("Finding canvas frame");
canvas = document.getElementById("canvas_frame");
if (canvas && canvas.contentDocument) {
console.log("Found canvas frame");
pimpmygmail();
}
}
function pimpmygmail() {
gmail = canvas.contentDocument;
if(!gmail) return;
window.clearInterval(interval);
console.log("Lets PIMP.MY.GMAIL!!!");
......rest of the code......
})();
This works perfectly fine in Firefox, but in Chrome, it gives me a top is undefined error.
Another thing i noticed is that if i remove the first line if(document.location != top.location) return; , the waitforiframe() method keeps getting called over and over again. (ie i see the "Finding canvas frame" error in the console)
can someone tell me what does the first line do? i mean what does it achieve & why does the waitforiframe() method run forever if i remove that line??
A BIG THANK YOU TO ALL WHO HELPED! -_- meh
btw, this was all i needed at the beginning of the script:
try { if(top.location.href != window.location.href) { return; } }
catch(e) { return; }