Monacaでアプリを作りたいのですが、戻るボタンの設置ができません。

Question

現在、monacaを使って簡単なアプリを作ろうとしています。
しかし、初心者のためいろいろ苦戦しているのですが、
その中で戻るボタンの設置です。
Androidはハード、ソフト面で戻るボタンが実装されているので
いいのですが、iphoneの場合は戻るボタンがないので
ツールバーに戻るボタンを付けたいと思っています。
<ons-back-button>
戻る
</ons-back-button>
を記述したところ、戻るという表示はでるのですが、実際デバッガーで
確認して戻るを押しても反応がありません。
どうすれば、戻るボタンを設置できるのでしょうか？

ソースコード
<template id="home.html">
<ons-page>
<iframe src="http://nihon-lifix.com/235-2/" seamless></iframe>
</div>
<ons-toolbar>
<ons-back-button> 戻る</ons-back-button>
<div class="left">
<ons-toolbar-button onclick="fn.open()">
<ons-icon icon="ion-navicon, material:md-menu"></ons-icon>
</ons-toolbar-button>
</div>
<div class="center">
<img src="images/Nihon-Lifix.png" alt="lifix" style="position:absolute;left:70px;top:10px;/>
</div>
</ons-toolbar>
</ons-page>
</template>

ご教授よろしくお願いいたします。

Answer 1

ons-back-buttonはons-navigatorでpushPageをした場合に前のページに戻るためのボタンです。
pushPageを行っていない場合、戻る対象のページがありませんので、戻れません。
ご提示頂いたソースコードからは、画面遷移をしているように見受けられませんでしたので、ons-back-buttonが動作する状況を作り出せていないものと想定します。（どこに戻ろうとされているのでしょうか？）

こちらのサンプルを見ていただくと分かり易いと思います。
１つ目と２つ目のページがあり、２つ目のページにons-back-buttonが定義されています。

Comments

[koichi0414]

ご回答ありがとうございます。説明不足ですみません。iframeにて自作のホームページを埋め込みたいと思っているのですが、リンク先に飛んだ時どうやって前のページに戻れるようにするのかがわかりません。そのような場合はどうやって戻る操作を実装できるのでしょうか？

[akabee]

そういうことでしたか。monacaのアプリを立ち上げたらiframeで別のサイトが擬似的に表示されるが、そのサイトでの戻る操作をアプリで実装したいということですね。
残念ながら、iframe、iOSともに知見がなく何も答えられません。monaca + iframeについては過去にも多くの質問がありましたが、皆さん苦戦されているようです。
最も類似していると思われる質問はこちらでしょうか。→https://teratail.com/questions/74246
個人的な意見としては、iframe上のサイトはmonacaとは無関係ですので、monacaで制御を行うこと自体が、かなり難しいと想定します。
iOSの「戻る」という動作がどのように制御されているかを詳細に調査した上で、monacaの制御上の画面で何らかの処理を行った場合に、「iOSにおける「戻る」という制御がiframe内のページで行われたことにする」ということを実装するようなことになるのではないかと思いますが、それが可能かどうかは不明です。
別の質問スレッドを立てることをお勧めします。