Q&A
Monaca・Onsen UIを使って、Ajax通信するアプリをつくっています。
Debugビルドしたアプリで、1回目の起動時は正常に通信できるのですが、２回目以降の起動時にはAjax通信ができなくなっているようだという問題が発生しています。
1回目は下記HTMLの<input id="send"～>をクリックすると、<input id="request"～>に入力した文字列を<div id="result">に表示するのですが、２回目は何も表示されません。
DebugビルドしたAndroidアプリでのみ発生しており、Monaca Debuggerでは発生せず正しく通信できています。iOS環境ではためしていません。
ご教示いただけましたら有り難いです。
index.html
1<!DOCTYPE HTML> 2<html> 3<head> 4 //略 5</head> 6<body> 7 //略 8 <ons-template id="home.html"> 9 <ons-page> 10 //略 11 <p style="text-align: center; opacity: 0.6; padding-top: 20px;"> 12 13 <h1>OnsenUIのAjaxをPHPで使う</h1> 14 <form method="post"> 15 <p><input id="request" size="10" maxlength="10"></p> 16 <p><input id="send" value="送信" type="submit"></p> 17 </form> 18 19 <div id="XMLHttpRequest"></div><!-- ステータスコード --> 20 <div id="textStatus"></div><!-- エラー情報 --> 21 <div id="errorThrown"></div><!-- 例外情報 --> 22 23 <div id="result"></div><!-- 返してきたデータを表示 --> 24 25 </p> 26 </ons-page> 27 </ons-template> 28 //略 29 30<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script> 31<script> 32$(document).ready(function() { 33 34 //送信ボタンをクリック 35 $('#send').click(function(){ 36 37 //POSTメソッドで送るデータを定義する 38 //var data = {パラメータ : 値}; 39 var data = {request : $('#request').val()}; 40 41 //Ajax通信メソッド 42 //type : HTTP通信の種類(POSTとかGETとか) 43 //url : リクエスト送信先のURL 44 //data : サーバに送信する値 45 $.ajax({ 46 type: "POST", 47 url: "OnsenUI_Ajax_test.php", 48 data: data, 49 //Ajax通信が成功した場合に呼び出されるメソッド 50 success: function(data, dataType){ 51 //デバッグ用 アラートとコンソール 52 alert(data); 53 console.log(data); 54 55 //出力する部分 56 $('#result').html(data); 57 }, 58 //Ajax通信が失敗した場合に呼び出されるメソッド 59 error: function(XMLHttpRequest, textStatus, errorThrown){ 60 alert('Error : ' + errorThrown); 61 $("#XMLHttpRequest").html("XMLHttpRequest : " + XMLHttpRequest.status); 62 $("#textStatus").html("textStatus : " + textStatus); 63 $("#errorThrown").html("errorThrown : " + errorThrown); 64 } 65 }); 66 return false; 67 }); 68}); 69</script> 70 71</body> 72</html>
OnsenUI_Ajax_test.php
1<?php 2 3$hogehoge = $_POST['request']; 4print($hogehoge); 5
あなたの回答
tips
プレビュー
