How to call a Javascript function by android - javascript

I have a problem something about JS and Android.
I need to call a JS function onclick by Android.
Here is the code :
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta name="viewport" content="width=device-width">
<link href="portrait-styles.css" type="text/css" rel="stylesheet" />
<script type="text/javascript">
function callApp() {
window.location = 'ios:webToNativeCall';
}
</script>
</head>
<body>
<div class="wrapper">
<img src="IO08_01.png" />
</div>
How can I get data ios:webToNativeCall to pass it to android and use android call url.
I know how to use only in IOS but I don't know how to use in android.

yes it is possible by using Javascript , try something like this http://android-er.blogspot.in/2011/10/call-javascript-inside-webview-from.html

Related

My html and javascript code is not working on Safari

I have written a html and javascript files.
Here is my code
HTML:
'''
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width">
<link href='https://fonts.googleapis.com/css?family=Open+Sans+Condensed:300|Bitter|Ubuntu+Mono' rel='stylesheet' type='text/css'>
<link rel="stylesheet" href="style.css">
</head>
<body>
<div class="wrapper">
<ul>
<li>New value: <span class="my-new"></span></li>
</ul>
</div>
</body>
<script src="event.js"></script>
</html>
and here is my javascript code
window.addEventListener('storage', function(e) {
document.querySelector('.my-new').textContent = e.newValue;
});
I write something on another page and want to display it on another page(the code of this page is shown here). Everything is fine, the code is working on Chrome. However, when I open it on safari, it does not display.
Javascript is enabled. I have no idea what is the problem. Please, help
Wich safari are you on? could be that your safari is old and you need to use:
document.getElementsByClassName('.my-new')
or better give it a id and use:
document.getElementById()
https://developer.mozilla.org/en-US/docs/Web/API/Document/getElementsByClassName
https://developer.mozilla.org/nl/docs/Web/API/Document/querySelector

HTA gives error in combination with angular

I made a angularjs HTML SPA that works fine.In a specific situation I need the power of a HTA. As far as I know there are no restrictions in using a HTA in combination with angular or any other valid HTML. Nevertheless I get an error when using the line
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
in a HTA, even when it's the only script tag in the header.
The error message is: Script error, Code 0, URL http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js
I would expect that others have encountered this error before but I can't find anything on stackoverflow.Does anybody recognize this problem? Is there a solution or workaround?
<!DOCTYPE html>
<html lang="en-US" ng-app="myApp" ng-controller="myCtrl">
<head>
<HTA:APPLICATION
APPLICATIONNAME="my app"
SINGLEINSTANCE="yes"/>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
</head>
<body>
<div >
...Do something
</div>
</body>
</html>
You have declared ng-app and ng-controller on HTML element, but its handlers are not defined. Also, as noted in comment, you must elevate implicit IE version to use sane JS engine with X-UA-Compatible meta. Adding those two lines fixes described error:
<!DOCTYPE html>
<html lang="en-US" ng-app="myApp" ng-controller="myCtrl">
<head>
<meta http-equiv="X-UA-Compatible" content="IE=Edge" />
<HTA:APPLICATION
APPLICATIONNAME="my app"
SINGLEINSTANCE="yes"/>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.js"></script>
<script>angular.module('myApp',[]).controller('myCtrl',['$scope',function($scope){}])</script>
</head>
<body>
<div>
...Do something
</div>
</body>
</html>

Why does my code only show a White Screen in the Nokia Here HTML5 version?

I have followed the following example from Nokia Here HTML5. It's not working as expected. This is my current code:
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
<!-- You should also add the following meta tags to support Blackberry 7.0+ devices -->
<meta name="HandheldFriendly" content="True">
<meta name="touch-event-mode" value="native">
<meta name="cursor-event-mode" value="native">
<!-- To disable address sniffing and prevent native maps from starting, use the following meta tags -->
<meta name="format-detection" content="telephone=no"/>
<meta name="format-detection" content="address=no"/>
<!-- <link rel="stylesheet" href="http://api.maps.nokia.com/mobile/1.0.2/lib/mh5.js">-->
<link rel="stylesheet" href="http://api.maps.nokia.com/mobile/latest/lib/colors.css">
<!-- <script src="http://api.maps.nokia.com/mobile/1.0.2/lib/mh5.js"></script>-->
<script src="http://api.maps.nokia.com/mobile/latest/lib/mh5.js"></script>
</head>
<body class="mh5_hwacc_body">
<div id="app_location" style="width:320px; height:480px; position:relative;"></div>
<script>
nokia.mh5.assetsPath = "http://api.maps.nokia.com/mobile/1.0.2/lib/";
nokia.mh5.app.embed({
domNode: "#app_location",
appId: "_peU-uCkp-j8ovkzFGNU",
appCode: "gBoUkAMoxoqIWfxWA5DuMQ"
});
</script>
</body>
</html>
I don't know why only shows a white screen. Do you have any idea?
Optionally, I have another question. Does anyone know if this mobile version allows adding markers and clustering?
You need to make sure that the <script> initializing the mh5 container is called after the <body class="mh5_hwacc_body"> has been initialized. It would also help to include the doctype element as well. If you run your example in Chrome and check the error statements you can see that is attempting to append items into the body of the DOM when it is still null. The quick start example (appended below) works fine.
You'll need to substitute in your own app id and token
<!doctype html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0,
maximum-scale=1.0, user-scalable=no">
<link rel="stylesheet"
href="http://api.maps.nokia.com/mobile/1.0.2/lib/mh5.css">
<link rel="stylesheet"
href="http://api.maps.nokia.com/mobile/1.0.2/lib/colors.css">
</head>
<body class="mh5_hwacc_body">
<script src="http://api.maps.nokia.com/mobile/1.0.2/lib/mh5.js">
</script>
<div id="app_location"
style="width: 320px; height: 480px; position: relative;">
</div>
<script>
nokia.mh5.assetsPath =
"http://api.maps.nokia.com/mobile/1.0.2/lib/";
nokia.mh5.app.embed ({
domNode: "#app_location",
appId: "YOUR APP ID",
appCode: "YOUR TOKEN"
});
</script>
</body>
</html>
Use the addPOI() method described here to add markers to the map.
Clustering is not a standard feature of MH5 - it is a framework, not an API - works best within its own use case - i.e. rapid cross-platform mobile development for "search for X, route for X, add markers for X" and drill down to give an infobubble or new page. Where X is supplied by your data.

Javascript won't work: Encoding error in Firefox

Whenever I try this, I get the following error in the Firefox console:
[09:20:30.028] The character encoding of the HTML document was not declared. The document will render with garbled text in some browser configurations if the document contains characters from outside the US-ASCII range. The character encoding of the page must to be declared in the document or in the transfer protocol.
<!DOCTYPE html>
<html>
<head>
<meta content="text/html;charset=utf-8" http-equiv="Content-Type">
<meta content="utf-8" http-equiv="encoding">
<title>this is a title</title>
<link rel="stylesheet" type="text/css" href="style.css" />
<script>
function showAnswer(){
document.getElementById("ans").innerHTML="This is the answer";
}
</script>
</head>
<body>
<div id="q">
This is a question?
<button action="showAnswer()">Show Answer</button>
</div>
<div id="ans">
</div>
</body>
</html>
Sorry if this is a stupid question, I'm kinda new to this.
You only need;
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
should fix your problem.
Get rid of
<meta content="utf-8" http-equiv="encoding">
You just want...
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
This is also wrong...
<button action="showAnswer()">Show Answer</button>
Probably want...
<button type="button" onclick="showAnswer()">Show Answer</button>
See http://jsfiddle.net/5Qtq2/

Js works in IE, Chrome but not Firefox

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>Remote Control</title>
</head>
<link rel="stylesheet" href="/../.." type="text/css" />
<title>page title</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<SCRIPT LANGUAGE="JavaScript" SRC="popup.js" > </script> <!-- <---- Problem, doesn't work in FF but ok in IE/Chrome -->
<body>
The script doesn't execute on Firefox like it does on IE and chrome. Why is this?
Could anyone tell me what needs to be done to make it work in FF?
Your popup.js file is full of references to a method called document.getelementbyid. There is no such method in JavaScript because its a case-sensitive language and thats the reason your code breaks right at the beginning of the hidep1() function.:
if (document.getelementbyid) {
Replace all occurrences of getelementbyid with getElementById and try again.

Categories

Resources