I've tried many variations of the script below, including changing the syntax and using window.prompt, but can't find a way to get the prompt to work.
Note: If there are errors in my other code (html), feel free to point them out, but focus on the JS - the page is loading perfectly with all elements, but the script simply doesn't run on a mobile device, even though it ran perfectly when I didn't have a prompt. Can you please help me?
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>program</title>
<link href="index.css" rel="stylesheet" type="text/css" />
</head>
<body>
<script>
var accesskey="config";
if( /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera
Mini/i.test(navigator.userAgent) ) {
var attempt=window.prompt("Mobile browsers are not currently supported. If
you are a developer, enter the access key.")
if(accesskey!=attempt)
{
alert("Bye!");
window.location("https://google.com);
}
else
{
console.log("Authenticated");
}
}
</script>
</body>
</html>
You have a number of line breaks / spaces in your regular expression and prompt message.
window.location is not a function; simply assign the URL to it.
You are missing a closing " at the end of google.com.
Fixing up these three issues produces the following working example:
var accesskey = "config";
if (/Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent)) {
var attempt = window.prompt("Mobile browsers are not currently supported. If you are a developer, enter the access key.")
if (accesskey != attempt) {
alert("Bye!");
window.location = "https://google.com";
} else {
console.log("Authenticated");
}
}
Hope this helps! :)
Prompt is working as below your regex is having line break and also its false so i have forced it to be true here.
Also window.location("https://google.com); is missing closing " and its a property not a function you should do window.location="https://google.com"
var accesskey="config";
if( /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent) || true)
var attempt=window.prompt("Mobile browsers are not currently supported. If you are a developer, enter the access key.")
if(accesskey!=attempt)
{
alert("Bye!");
window.location ="https://google.com";
}
else
{
console.log("Authenticated");
}
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>program</title>
</head>
<body>
</body>
</html>
Related
Below is my piece of code that work's in all the browser in all the OS, except ipad chrome. Help me out here.
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<script>
function myprint() {
const wnd = window.open('about:blank', '', '_blank, alwaysRaised=yes');
wnd.document.write('<html><head><title></title>');
wnd.document.write('</head><body>');
wnd.document.write('<div>JavaScript often abbreviated as JS, is a high-level, interpreted programming language. It is a language which is also characterized as dynamic, weakly typed, prototype-based and multi-paradigm.</div>');
wnd.document.write('<div class="print-header"><button title="Print" onclick="window.print()">Print</button></div>');
wnd.document.write('</body></html>');
wnd.document.close();
}
</script>
<body>
<button onclick="myprint()">popup</button>
</body>
</html>
Here Im trying to open my content using window.open() then print them using window.print(). That's all. jsfiddle
This link also not working in ipad chrome.
Print
This is an issue with Chrome on iOS. Because of Apple’s policy on third party browsers, Chrome is actually just a WebView component. Printing is currently not supported. As far as I am aware, there is currently no workaround for this issue.
Try this code, if it not works another solution is to use a third-party printing service like this: http://www.printfriendly.com
function goPrint(){
window.print();
if(navigator.userAgent.toLowerCase().indexOf('chrome') > -1) {
window.location.reload();
}
}
You are using a backtick character ` in this line:
wnd.document.write(`<div class="print-header"><button title="Print" onclick="window.print()">Print</button></div>`);
This is a Templated literal and might not be supported. Try replacing it with a single quote:
wnd.document.write('<div class="print-header"><button title="Print" onclick="window.print()">Print</button></div>');
I have a web page with a button. The click code is:
var html = ...html string containing visual and script elements...
var view = window.open();
view.document.write(html);
view.init(<parameters>); // see next code block
the html content is:
<!DOCTYPE html>
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<style type="text/css">
html, body {
height: 100%;
margin: 0;
}
</style>
</head>
<body>
<div id="id1"></div>
<script>
function init(<parameters>) {
...work...
}
</script>
</body>
</html>
The problem is with the init function call in chrome: all good if I am in IE, but in chrome I get "init function not defined" exception.
How should I do to get this working in all browsers? Of course I am looking for a solution that doesn't require a server round trip.
IM a noob so idk if this is exaclty true but i have read that ie allows you to do alot more then chrome or firefox. It might be one of those example where ie will let you do something.
using document.write does in fact work when it comes to create the page I want. Problem is when I want to call a function defined in a javascript block inside that page. Different browsers give different results so I guess this is a matter not completely standardized yet. There are posts in the internet about this, but I couldn't find a clear and common answer.
I then solved my impasse with a workaround. The initial markup contains now placeholders for the parameters:
<!DOCTYPE html>
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<style type="text/css">
html, body {
height: 100%;
margin: 0;
}
</style>
</head>
<body>
<div id="id1"></div>
<script>
(init = function () {
var parameter1 = ${{placeholder1}}
var parameter2 = ${{placeholder2}}
...
...work...
})();
</script>
</body>
</html>
The creating code, then, replaces the placeholders with actual values:
var html = ...html string containing placeholders...
html = html.replace("${{placeholder1}}", actual1);
html = html.replace("${{placeholder2}}", actual2);
...
var view = window.open();
view.document.write(html);
Now the init function is called in the same page context, and this works in Chrome as well.
It is not possible to write to a new window if its not on the same domain. What I suggest is that you can open an iframe an work inside that.
How to write to iframe
How to write to page on same domain
My device is a HTC One X, browser is Chrome. I'm trying to get HTML5 GeoLocation to work in browser however I'm unable to, it works on iOS and desktop however nothing for my Android. Below is my code:
<!DOCTYPE html>
<html>
<head>
<meta content='text/html; charset=UTF-8' http-equiv='Content-Type' />
<meta content='width=device-width, initial-scale=1, maximum-scale=1' name='viewport'>
<title>HTML5 Test</title>
<script src='http://cloud.keepiteasy.net/libs/modernizr.custom.89661.js' type='text/javascript'></script>
<script src='http://cloud.keepiteasy.net/libs/jquery.js' type='text/javascript'></script>
</meta>
</head>
<body>
<script type="text/javascript">
$(function() {
if (Modernizr.geolocation) {
navigator.geolocation.getCurrentPosition(success, error);
}
function success(position) {
var lat = position.coords.latitude;
var lng = position.coords.longitude;
alert(lat);
alert(lng);
}
function error(err) {
if(err.code == 1) {
alert("Error: Access is denied!");
}else if( err.code == 2) {
alert("Error: Position is unavailable!");
}
}
});
</script>
</body>
</html>
UPDATE: I fixed the doctype
UPDATE: I updated the error function
UPDATE: On my HTC I am still getting nothing, not even an error. On my Nexus 7 (just tried it), it works fine... WTF, hardware issue? But other GPS based apps work...
I got the same issue on my HTC One X. At least you can make sure, your error function gets called, by adding a timeout:
navigator.geolocation.getCurrentPosition(success, error, {timeout:3000});
In this example, your error function gets called after 3 seconds.
Seems to be a hardware issue of some sort as no website can acquire my geolocation on my OneX, however my Nexus 7 the above code works fine.
Just restart your phone, guys. Yeah it's kinda stupid but it's the solution.
I am trying to access a public-facing site (not one that I developed but is being used as a reference site) and it does not load in IE8 (which is our corporate standard browser). It loads fine in Chrome (not all users have it). The error I receive is "res://ieframe.dll/acr_error.htm...". Do I have to configure IE8 in some way to render this? Any and all assistance to better troubleshoot this would be greatly appreciated.
I looked at the source via "View source" and I see the following towards the top:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
<link rel="stylesheet" type="text/css" href="http://code.jquery.com/mobile/1.0a2/jquery.mobile-1.0a2.min.css" />
<link rel="stylesheet" type="text/css" href="/css/mobile.css" />
<link rel="stylesheet" type="text/css" href="/css/main.css" />
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
<script type="text/javascript" src="/js/plugins/jquery.scroll.js"></script>
<script type="text/javascript" charset="utf-8">
$(document).bind("mobileinit", function(){
$.extend( $.mobile , {
ajaxFormsEnabled : false,
ajaxLinksEnabled : false
});
});
</script>
<script type="text/javascript" src="http://code.jquery.com/mobile/1.0a2/jquery.mobile-1.0a2.min.js"></script>
Does the above code snippet suffice to assist with some advice or is the whole HTML document needed?
I think you need to start by wrapping that in a
$(document).ready(function{
});
segment, otherwise you may run into all sorts of trouble.
unfortunately your question is too vague to get you a reliable answer, however a quick google search landed me on this:
http://answers.microsoft.com/en-us/ie/forum/ie8-windows_other/resieframedll-error-in-ie-8/7f657540-474f-4587-b661-c3ffbb1aed06
So I am suspecting it's a problem with your installation of ie8. If not please supply more info :)
I doubt jQuery Mobile has much support for IE8. It's built with mobile browsers in mind so the main rendering engines would be Webkit(Chrome) and Gecko(Fx). It's that simple.
JQuery mobile is supported by IE 8 if it is the correct version, but this line here may be the error:
<script type="text/javascript" charset="utf-8">
$(document).bind("mobileinit", function(){
$.extend( $.mobile , {
ajaxFormsEnabled : false,
ajaxLinksEnabled : false
});
});
</script>
<script type="text/javascript" src="http://code.jquery.com/mobile/1.0a2/jquery.mobile-1.0a2.min.js"></script>
You are calling something with mobile before your mobile script is imported. You need to first import your mobile script, then do a document.ready() call a Javascript function at the VERY END of you html page that will run all init functions.
This is one of the few calls you want to run before loading JQuery Mobile
//run this script after jQuery loads, but before jQuery Mobile loads, and may help solve your issue
//customize jQuery Mobile to let IE7+ in (Mobile IE)
$(document).bind("mobileinit", function(){
$.extend( $.mobile , {
//extend gradeA qualifier to include IE7+
gradeA: function(){
//IE version check by James Padolsey, modified by jdalton - from http://gist.github.com/527683
var ie = (function() {
var v = 3, div = document.createElement('div'), a = div.all || [];
while (div.innerHTML = '<!--[if gt IE '+(++v)+']><br><![endif]-->', a[0]);
return v > 4 ? v : !v;
}());
//must either support media queries or be IE7+
return $.support.mediaquery || (ie && ie >= 7);
}
});
});
OK guys this is intreting,
I'm testing this page
http://static.nemesisdesign.net/demos/ie8-strange/test.html
on IE8 / windows XP.
This is the code:
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="content-language" content="en">
<title>Test</title>
</head>
<body>
<div id="thisgivesmeanerror">test</div>
<script>
thisgivesmeanerror = 'test';
alert('this alert won\'t be fired on my IE8, what about yours?');
</script>
</body>
</html>
If I open this page with IE8 I get an error.
If I change the code of the script to:
<script>
// note that I added var prefix
var thisgivesmeanerror = 'test';
alert('this alert won\'t be fired on my IE8, what about yours?');
</script>
It works fine.
This happens only on IE 7/8, didn't test it on IE6.
What do you think?
Does it happen to you also? Or is it just my browser that has gone crazy?
Addition
You're saying that is just not using the var prefix that cause the error?
I'm sorry guys but you're wrong, you didn't take time to test the code.
I uploaded a test2 page
http://static.nemesisdesign.net/demos/ie8-strange/test2.html
with the follwing cocde
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="content-language" content="en">
<title>Test 2</title>
</head>
<body>
<div id="thisgivesmeanerror">test</div>
<script>
thisdoesntgiveanyerror = 'test';
alert('This alert will be fired correcly');
</script>
</body>
</html>
That works fine.
So what is actually causing the error? The variable name without the var prefix having the same name as the ID of the DIV element.
Isn't this strange?
May be the answers to this SO-question can help?
You should always precede your variable declarations with var to specify their scope or you might observe inconsistent behavior between different browsers.
use var to declare variables instead of just plugging their name
I'd say the JavaScript interpreter in IE is slightly stricter than on FireFox and others, meaning the script returns an error when it comes to the variable definition line. Putting var in will ensure it actually is a variable.
It's very good practice to declare all your variables with var
James
EDIT
I can't get to IE at the moment, but I can recommend you change your <script> tag to <script type="text/javascript">.