# bubble iPhoneのタッチ動作

**URL:** <https://www.nocode-faq.com/t/topic/4376>\
**Category:** bubble\
**Created:** [2024 年 8 月 26 日午後 7:27 UTC](https://www.nocode-faq.com/t/topic/4376 "2024-08-26T19:27:59Z")\
**Posts on this page:** 2\
**Page:** 1

<div class="post-metadata">

**Author:** ![macchi\_hal](https://sea2.discourse-cdn.com/flex020/user_avatar/www.nocode-faq.com/macchi_hal/32/6234_2.png) [@macchi\_hal](https://www.nocode-faq.com/u/macchi_hal)\
**Post date:** [2024 年 8 月 26 日午後 7:27 UTC](https://www.nocode-faq.com/t/topic/4376/1 "2024-08-26T19:27:59Z")

</div>

### 1.前提条件

・bubbleでチャット機能を作成している  
・iPhoneにおいて画面クリックが出来なくなる時がある  
・発生するのはiPhone12なども新しいiPhoneのみ

### 2.発生している問題

チャットを繰り返し送っていると、ある時いきなり画面クリックが出来なくなる時があります。新しいiPhoneでのみ発生します。数秒ほど待つと再度クリックができるようになります。

チャットを送るとinputのvalueをcreate a newしてinputをresetするワークフローを組んでいます。resetによってinputへのフォーカスは外れキーボードは閉じて、再びinputやあるいは戻るボタンなどを押せるはずですが、チャットでメッセージを繰り返し送信していると突然クリックができなくなる形です。

inputをクリックできないだけでなく、画像を送るためのpicture uploader、チャット一覧への戻るボタン、ユーザー詳細ボタンなど画面内のあらゆるタッチが無効になり大変困っています。

どうすればいいでしょうか？

### 5.スクリーンショット

制作しているチャット画面のデザインです。左下のアイコンはそれぞれalign to parentで囲まれていて見えないfile uploader、native camera、picture uploaderが配置されていてアップロード可能です。

 ![236209](https://us1.discourse-cdn.com/flex020/uploads/ncc_forum/original/2X/9/921c9d789a9b71a4163d87385c3237d46bd16565.jpeg)

### 7.補足情報 （調べたURL/参考になりそうな事例）

色々調べてみてここら辺の記事がヒントかもしれないなあと予測しています。。

> **[iPhoneやiPadのSafariでボタンがタップできない（window.openが効かない）時の対処法 | Promapedia（プロマペディア）](https://ssaits.jp/promapedia/trouble/20210515.html)**
>
> PhoneやiPadのSafariでボタンが効かない？その原因はポップアップブロックかもしれません。JavaScriptのwindow.open()がSafariでブロックされる問題について、location.hrefを使う代替案や、clickイベントを利用した回避策を解説します。

> **[iOS Safariでinput要素のfocusを簡単に外す方法 - Qiita](https://qiita.com/wintyo/items/aeecb1e62e77611bf842)**
>
> 始めに iOS Safariでinput要素を選択してキーボードが出ているとき、何も設定しないと画面をタップしただけではfocusを外してキーボードを閉じることができません。これを何とかするために今まではJSでblurするようにしていましたが、もっと単純な方法があったので...

> **[iPhoneでhoverやclickイベントが思い通りにならない場合の処方箋【CSS】【Javascript】 | Analog Studio](https://analogstd.com/pc/iphone-hover-click-faq/)**
>
> Web サイトを設計する際に PC や Android 端末では想定通りの動作をするのに iPhone だけはうまくいかないことがあります。 そこで、今回はそうなってしまった場合にどのように対処するかをまとめます。 CSS の :hover

---

<div class="post-metadata">

**Author:** ![NoCodeCamp](https://sea2.discourse-cdn.com/flex020/user_avatar/www.nocode-faq.com/nocodecamp/32/6947_2.png) [@NoCodeCamp](https://www.nocode-faq.com/u/NoCodeCamp)\
**Post date:** [2024 年 9 月 2 日午後 3:36 UTC](https://www.nocode-faq.com/t/topic/4376/2 "2024-09-02T15:36:15Z")

</div>

3日以上回答が付きませんね。。

これは運営Botです。  
なかなか回答が付かない場合には、

質問フォーマットに沿って質問をすることで、回答が得られるかもしれません。

以下のフォーマットを参考にしてください

**スキルに関係なく自由に投稿下さい**

- 質問者の方は、あとの方が読みやすいように、回答者が推測しやすいようにする為、わかりやすいタイトルや画像などを多めに張り付けるようにしてください。また、質問に回答してもらった場合には、一言でも”お礼”を言っていただければ、回答者の励みになります。

**質問の範囲**

ノーコードツールに質問のある範囲でお願いします。Javascript,Flutter などのコーディング要素が含まれていた場合には回答しきれない可能性があります。

質問テンプレートに沿って投稿いただくと回答いただける可能性があがりますので、なるべく詳細を記入するようにしてください。回答する方にわかりやすいよう質問文章も整理して投稿下さい。

質問には、少し下にあるテンプレートを使って下さい。

**回答者の方は、** スキルは問いません。どんな方が回答いただいても結構です。交流や質問者の気づきになれば良いので、積極的にコメント下さい。アウトプットすることで勉強になることも多いはずです。

**免責事項**

本スレッドは、NoCodeCampのオンラインサロンの管理ですが、回答を保証したり、正確性を担保することはできません。サロン生の交流を目的とした質問回答となります。

以下に関する質問には、回答がつかない可能性があります。

・案件に関する要件定義

・バックグラウンドがわからない

**たくさんの回答が欲しい場合には、構築人材の紹介もしてます**

その他、急ぎや対応や、構築の支援が欲しいときはありませんか？

例えば、業務案件で、すぐに回答が必要の場合には、人材紹介事業を検討下さい。

[NoCodeCamp人材紹介](https://nocodecamp.co.jp/jinzai)

**質問者のテンプレート**

- この文章は投稿時削除下さい。

以下は、投稿する人のためのテンプレートです。

必要のない項目は、削除下さい。

###・前提条件・発生している問題・エラーメッセージ ・実装したい機能

### スクリーンショット

- できれば、全体が分かるようにスクリーンショットを載せてもらえれば助かります。