質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.50%
JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

HTML

HTMLとは、ウェブ上の文書を記述・作成するためのマークアップ言語のことです。文章の中に記述することで、文書の論理構造などを設定することができます。ハイパーリンクを設定できるハイパーテキストであり、画像・リスト・表などのデータファイルをリンクする情報に結びつけて情報を整理します。現在あるネットワーク上のほとんどのウェブページはHTMLで作成されています。

Monaca

「Monaca」はiOS、Android、Windows向けのアプリ開発に対応した、Cordovaベースのモバイルアプリ開発プラットフォームです。HTML5、JavaScriptといったWeb標準技術を用いてモバイルアプリ開発を行うことができます。

Q&A

解決済

2回答

2536閲覧

超初心者:monacaでアプリ内ブラウザでjavascriptで生成したURLを開きたい

hirory

総合スコア42

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

HTML

HTMLとは、ウェブ上の文書を記述・作成するためのマークアップ言語のことです。文章の中に記述することで、文書の論理構造などを設定することができます。ハイパーリンクを設定できるハイパーテキストであり、画像・リスト・表などのデータファイルをリンクする情報に結びつけて情報を整理します。現在あるネットワーク上のほとんどのウェブページはHTMLで作成されています。

Monaca

「Monaca」はiOS、Android、Windows向けのアプリ開発に対応した、Cordovaベースのモバイルアプリ開発プラットフォームです。HTML5、JavaScriptといったWeb標準技術を用いてモバイルアプリ開発を行うことができます。

0グッド

0クリップ

投稿2016/01/23 14:37

htmlでアプリが作れるmonacaでjavascriptの記述で質問です。
html,javascriptを書いたのはこれが初めてな超初心者です・・・
この人の青春時代の曲とイベントをケンサク!
というリンクを作っているのですが、このリンクをクリックすると、
アプリ内ブラウザで生成したURLを開きたいです・・・
調べたところによるとwindow.openを使えばいいとのことですが、
どこに入れればいいのか全く分からず困りました。。。。

よろしくお願いします。

html

1<!DOCTYPE HTML> 2<html> 3<head> 4 <meta charset="utf-8"> 5 <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no"> 6 <meta http-equiv="Content-Security-Policy" content="default-src * data:; style-src * 'unsafe-inline'; script-src * 'unsafe-inline' 'unsafe-eval'"> 7 <script src="components/loader.js"></script> 8 <link rel="stylesheet" href="components/loader.css"> 9 <link rel="stylesheet" href="css/style.css"> 10 <script> 11 $(function(){ 12 var output = $('#sample2_output'); 13 //ファイル選択の変更イベント 14 $('#sample2_input').on('change', 'input', function(event){ 15 //前回の処理結果をクリアする。 16 output.empty(); 17 var reader = new FileReader(); 18 reader.onload = (function(theFile) { 19 return function(e) { 20 var dataurl = e.target.result; 21 22 //DataURLをBLOBに変換 23 var mime_base64 = dataurl.split(',', 2); 24 var mime = mime_base64[0].split(';'); 25 mime = mime[0].split(':'); 26 mime = mime[1]? mime[1]: mime[0]; 27 var base64 = window.atob(mime_base64[1]); 28 var len = base64.length; 29 var bin = new Uint8Array(len); 30 for (var i=0; i<len; i++) 31 { 32 bin[i] = base64.charCodeAt(i); 33 } 34 var blob = new Blob([bin], {type:mime}); 35 //APIのURLパラメタを設定 36 var params = { 37 'subscription-key': '秘密のプライマリキー' 38 ,analyzesAge: 'true' 39 ,analyzesGender: 'true' 40 }; 41 $.ajax({ 42 url: 'https://api.projectoxford.ai/face/v0/detections?' + $.param(params) 43 ,type: 'POST' 44 //contentTypeを明示する 45 ,contentType:'application/octet-stream' 46 //processDataをfalseにして自動処理せずBLOBをPOSTする 47 ,processData:false 48 ,data:blob 49 }) 50 .done(function(data) { 51 //選択画像のDataURLで画像を生成 52 $('<img />').attr('src', dataurl).appendTo(output); 53 //検出した顔の分だけ繰り返す 54 $.each(data, function(){ 55 var face = this.faceRectangle; 56 var attr = this.attributes; 57 //顔を囲む矩形のdivを追加 58 $('<div class="f" />').css({ 59 left:face.left*0.24 60 ,top:face.top*0.24 61 ,width:face.width*0.24 62 ,height:face.height*0.24 63 }) 64 .appendTo(output); 65 66 //性別と年齢のdivを追加 67 $('<div class="a" />').css({ 68 left:face.left*0.24 69 ,top:(face.top*0.24+ face.height*0.24) 70 }) 71 .text(attr.gender +' '+ attr.age) 72 .appendTo(output); 73 74 output.append('<a href="http://music.oricon.co.jp/php/special/Special.php?y='+(2015-attr.age)+'&m=4&age=17&pcd=result&dir=timeslip' + '">この人の青春時代の曲とイベントをケンサク!:</a>' + attr.gender + attr.age + '歳' + '</p>'); 75 //window.open("'http://music.oricon.co.jp/php/special/Special.php?y='+(2015-attr.age)+'&m=4&age=17&pcd=result&dir=timeslip'"); 76 navigator.notification.alert(attr.gender +' '+ attr.age+'ですね!', null, "この写真の人の性別と年齢はズバリ!"); 77 }); 78 }) 79 .fail(function() { 80 alert('error'); 81 }); 82 }; 83 })(event.target.files[0]); 84 reader.readAsDataURL(event.target.files[0]); 85 }); 86}); 87 </script> 88</head> 89<body> 90<br> 91<br> 92<br> 93<br> 94 95<label>Subscription Key(Primary key): <input type="text" id="sample2_key" /></label> 96<div id="sample2_input"> 97 <label>顔写真: <input id="sample2_input" type="file"/></label> 98</div> 99<div id="sample2_output"></div> 100 101 102</body> 103</html> 104

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

回答2

0

まず、質問者さんがjavascriptだと思っている記述の中に、jqueryの記述が混在している点に注意してください。
jqueryを使用する場合は、jqueryファイルの読み込みが必要になります。Googleにホストされているjqueryファイルを読み込むことも出来ます。

直接的な回答ではないですが、解決のヒントになればと思い、リンクとなるセレクタがクリックされた場合に window.open される処理を記述します。

html

1<head> 2 <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script> 3</head> 4<body> 5 <div class="target">ここをくりっく</div> 6</body>

javascript

1$(function(){ 2 var $url = "https://teratail.com/" 3 var $target = $('.target').on('click',function(){ 4 window.open($url, "url"); 5 }); 6});

投稿2016/01/27 03:57

k_fujimoto

総合スコア181

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

0

自己解決

今になって考えて見れば、fuluter使ってればもっとアプリにサクッと入門できただろうなぁ

投稿2019/01/02 07:28

hirory

総合スコア42

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.50%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問