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

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

ただいまの
回答率

90.42%

  • JavaScript

    18061questions

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

  • HTML

    9909questions

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

  • Monaca

    1022questions

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

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

解決済

回答 2

投稿

  • 評価
  • クリップ 0
  • VIEW 1,079

hirory

score 8

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

よろしくお願いします。

<!DOCTYPE HTML>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
    <meta http-equiv="Content-Security-Policy" content="default-src * data:; style-src * 'unsafe-inline'; script-src * 'unsafe-inline' 'unsafe-eval'">
    <script src="components/loader.js"></script>
    <link rel="stylesheet" href="components/loader.css">
    <link rel="stylesheet" href="css/style.css">
    <script>
    $(function(){
  var output = $('#sample2_output');
  //ファイル選択の変更イベント
  $('#sample2_input').on('change', 'input', function(event){
    //前回の処理結果をクリアする。
    output.empty();
    var reader = new FileReader();
    reader.onload = (function(theFile) {
      return function(e) {
        var dataurl = e.target.result;

        //DataURLをBLOBに変換
        var mime_base64 = dataurl.split(',', 2);
        var mime = mime_base64[0].split(';');
        mime = mime[0].split(':');
        mime = mime[1]? mime[1]: mime[0];
        var base64 = window.atob(mime_base64[1]);
        var len = base64.length;
        var bin = new Uint8Array(len);
        for (var i=0; i<len; i++)
        {
          bin[i] = base64.charCodeAt(i);
        }
        var blob = new Blob([bin], {type:mime});
        //APIのURLパラメタを設定
        var params = {
          'subscription-key': '秘密のプライマリキー'
          ,analyzesAge: 'true'
          ,analyzesGender: 'true'
        };
        $.ajax({
          url: 'https://api.projectoxford.ai/face/v0/detections?' + $.param(params)
          ,type: 'POST'
          //contentTypeを明示する
          ,contentType:'application/octet-stream'
          //processDataをfalseにして自動処理せずBLOBをPOSTする
          ,processData:false
          ,data:blob
        })
        .done(function(data) {
          //選択画像のDataURLで画像を生成
          $('<img />').attr('src', dataurl).appendTo(output);
          //検出した顔の分だけ繰り返す
          $.each(data, function(){
            var face = this.faceRectangle;
            var attr = this.attributes;
            //顔を囲む矩形のdivを追加
            $('<div class="f" />').css({
              left:face.left*0.24
              ,top:face.top*0.24
              ,width:face.width*0.24
              ,height:face.height*0.24
            })
            .appendTo(output);

            //性別と年齢のdivを追加
            $('<div class="a" />').css({
              left:face.left*0.24
              ,top:(face.top*0.24+ face.height*0.24)
            })
            .text(attr.gender +' '+ attr.age)
            .appendTo(output);

            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>');
            //window.open("'http://music.oricon.co.jp/php/special/Special.php?y='+(2015-attr.age)+'&m=4&age=17&pcd=result&dir=timeslip'");
            navigator.notification.alert(attr.gender +' '+ attr.age+'ですね!', null, "この写真の人の性別と年齢はズバリ!");
          });
        })
        .fail(function() {
          alert('error');
        });
      };
    })(event.target.files[0]);
    reader.readAsDataURL(event.target.files[0]);
  });
});
    </script>
</head>
<body>
<br>
<br>
<br>
<br>

<label>Subscription Key(Primary key): <input type="text" id="sample2_key" /></label>
<div id="sample2_input">
  <label>顔写真: <input id="sample2_input" type="file"/></label>
</div>
<div id="sample2_output"></div>


</body>
</html>
  • 気になる質問をクリップする

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

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

    クリップを取り消します

  • 良い質問の評価を上げる

    以下のような質問は評価を上げましょう

    • 質問内容が明確
    • 自分も答えを知りたい
    • 質問者以外のユーザにも役立つ

    評価が高い質問は、TOPページの「注目」タブのフィードに表示されやすくなります。

    質問の評価を上げたことを取り消します

  • 評価を下げられる数の上限に達しました

    評価を下げることができません

    • 1日5回まで評価を下げられます
    • 1日に1ユーザに対して2回まで評価を下げられます

    質問の評価を下げる

    teratailでは下記のような質問を「具体的に困っていることがない質問」、「サイトポリシーに違反する質問」と定義し、推奨していません。

    • プログラミングに関係のない質問
    • やってほしいことだけを記載した丸投げの質問
    • 問題・課題が含まれていない質問
    • 意図的に内容が抹消された質問
    • 広告と受け取られるような投稿

    評価が下がると、TOPページの「アクティブ」「注目」タブのフィードに表示されにくくなります。

    質問の評価を下げたことを取り消します

    この機能は開放されていません

    評価を下げる条件を満たしてません

    評価を下げる理由を選択してください

    詳細な説明はこちら

    上記に当てはまらず、質問内容が明確になっていない質問には「情報の追加・修正依頼」機能からコメントをしてください。

    質問の評価を下げる機能の利用条件

    この機能を利用するためには、以下の事項を行う必要があります。

回答 2

+1

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

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

<head>
  <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
</head>
<body>
  <div class="target">ここをくりっく</div>
</body>
$(function(){
  var $url = "https://teratail.com/"
  var $target = $('.target').on('click',function(){
    window.open($url, "url");
  });
});

投稿

  • 回答の評価を上げる

    以下のような回答は評価を上げましょう

    • 正しい回答
    • わかりやすい回答
    • ためになる回答

    評価が高い回答ほどページの上位に表示されます。

  • 回答の評価を下げる

    下記のような回答は推奨されていません。

    • 間違っている回答
    • 質問の回答になっていない投稿
    • スパムや攻撃的な表現を用いた投稿

    評価を下げる際はその理由を明確に伝え、適切な回答に修正してもらいましょう。

check解決した方法

-2

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

投稿

  • 回答の評価を上げる

    以下のような回答は評価を上げましょう

    • 正しい回答
    • わかりやすい回答
    • ためになる回答

    評価が高い回答ほどページの上位に表示されます。

  • 回答の評価を下げる

    下記のような回答は推奨されていません。

    • 間違っている回答
    • 質問の回答になっていない投稿
    • スパムや攻撃的な表現を用いた投稿

    評価を下げる際はその理由を明確に伝え、適切な回答に修正してもらいましょう。

同じタグがついた質問を見る

  • JavaScript

    18061questions

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

  • HTML

    9909questions

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

  • Monaca

    1022questions

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