読み込み後発動するjsを他のjsに連携させたい
javascriptを使ってiPhoneアプリを作っています。
サーバー側のmysqlと交信させるようにしているのですが、下記のように単純にpostすると、post後に表示されるのはサーバー側のhoge.ne.jp/usr_in.phpです。
【iphone側 index.html】
<script type="text/javascript" src="js/jquery.js"></script>
<form name="form1" id="form1" method="POST" name="form1" action="https://hoge.ne.jp/usr_in.php">
<input type=“hidden” name="myname" value="" />
<input type="hidden" name="pass" value="" />
<button class="button8">購入</button>
</form>
そこで、下記のような【遷移JS】を用い、ボタンを押すと、サーバー側にpostしたあと、【iphone側のfinish.html】に遷移するようにしました。ここまではうまくいきました。
【遷移JS】
<script type="text/javascript" src="js/jquery.js"></script>
<script>
jQuery(function($) {
$('#form1').submit(function(event) {
// HTMLでの送信をキャンセル
event.preventDefault();
// 操作対象のフォーム要素を取得
var $form = $(this);
// 送信ボタンを取得
// （後で使う: 二重送信を防止する。）
var $button = $form.find('button');
// 送信
$.ajax({
url: $form.attr('action'),
type: $form.attr('method'),
data: $form.serialize()
+ '&delay=1', // （デモ用に入力値をちょいと操作します）
timeout: 10000, // 単位はミリ秒
// 送信前
beforeSend: function(xhr, settings) {
// ボタンを無効化し、二重送信を防止
$button.attr('disabled', true);
},
// 応答後
complete: function(xhr, textStatus) {
// ボタンを有効化し、再送信を許可
$button.attr('disabled', false);
},
// 通信成功時の処理
success: function(result, textStatus, xhr) {
// 入力値を初期化
$form[0].reset();
//
location.href = "finish.html";
//
},
// 通信失敗時の処理
error: function(xhr, textStatus, error) {
alert('購入できませんでした。再度お試しください'); }
});
});
});
</script>
<form name="form1" id="form1" method="POST" name="form1" action="https://hoge.ne.jp/usr_in.php">
<input type=“hidden” name="myname" value="" />
<input type="hidden" name="pass" value="" />
<button class="button8">登録</button>
</form>
次に、このmysqlへの会員登録機能を自動化するために、読み込み後に自動的にsubmitされる【自動実行JS】を組み、<body onLoad="loadHello()"></body>で囲んだ後、<form></form>の最底辺に挿入しました。
【自動実行JS】
<SCRIPT language="JavaScript">
function loadHello(){
document.form1.submit();
}
</script>
結果、自動登録機能は機能するのですが、サーバー側のhoge.ne.jp/usr_in.phpが表示されてしまい、【iphone側のfinish.html】に遷移してくれません。
bodyをloadした後、【自動実行JS】が実行された時に、【遷移JS】にトスされずにそのまま送信されてしまうようです。どこをどう修正すればいいかご教授願います。
お礼
イメージできました。これからＨＴＭＬ、ＣＳＳ、ＪａｖａＳｃｒｉｐｔ、ＰＨＰ、ＭｙＳＱＬ、ＵＮＩＴＹを勉強しようと思います。ありがとう御座いました。