人力検索はてな
モバイル版を表示しています。PC版はこちら
i-mobile

JavaScriptについて質問です。

HTMLのみであればsubmitでデータを渡したりが可能ですが、動的ページを作成するにあたり画面を遷移することなくサーバーとデータをやり取りしたいと考えております。

単純にリンクをクリックした際にサーバー側に「abc」という文字列を送りたいと思っておりますが以下のものをどのように改変及び付加すれば、それが可能になるのかアドバイスいただけないでしょうか?

<a href="#">abc送信</a>


●質問者: quocard
●カテゴリ:コンピュータ インターネット
○ 状態 :終了
└ 回答数 : 2/2件

▽最新の回答へ

1 ● Cherenkov
●50ポイント

XMLHttpRequestを使う。
XMLHttpRequest の使い方 - WebOS Goodies


見た目が悪いからjQueryの$.get, $.postを使う。
Ajax - jQuery 日本語リファレンス

<script>
$(function() {
 $('#send_key').click(function() {
 $.get("test.php", { keyword: "abc" } );
 });
}
</script>

<a id="send_key" href="#">abc送信</a>



適当にimgを作ってGETを飛ばす。
http://jsfiddle.net/cherenkov/WVJTV/

<script>
function sendKey() {
 var img = document.createElement('img');
 img.src = 'abc';
}
</script>

<a onclick="sendKey()" href="#">abc送信</a>

quocardさんのコメント
回答ありがとうございます。 こちらひじょうに参考になりました。 これを取っ掛かりに広げていきたいと思います。

2 ● ymlab
●50ポイント

チェレンコフさんがおっしゃるように、Ajaxを使うのが一般的です。
Ajaxとは、(Asynchronous JavaScript + XML)の頭文字を取ったもので、
2005年にこれまでの技術を組み合わせて考えられました。
Javascriptで、サーバに、非同期通信を行います。

具体的な流れとしては、チェレンコフさんが既にお書きですので、
システムの流れを。
1.ユーザが、ブラウザ上で、リンクを押下。
2.ブラウザのjavascriptが、サーバに非同期通信でメッセージを送る。
3.サーバのシステムが、メッセージを受け取りサーバで処理をする。
4.サーバのシステムが、javascriptにメッセージを返す。
5.ブラウザのjavascriptが、画面を更新する。

という具合です。
従って、javascript単体で非同期通信は不可能です。
サーバにそれを待ち受けるPHPやruby,perlなどの何らかの受け取るための
システムが必要です。

私は、
http://www.openspc2.org/JavaScript/Ajax/Ajax_study/
のサイトを見て学習をしました。

また、jQueryやprototypeは、上記の手続きが面倒すぎるので、
それを簡単にするためのライブラリです。
個人的には、jQueryが超便利でお勧めですが、まずは、
普通に書いてみましょう。


quocardさんのコメント
回答ありがとうございます。 提示いただいたサイトはとてもわかりやすく参考になりました。 こちらで少し知識をつけてからさらにチャレンジしていきたいと思います。
関連質問

●質問をもっと探す●



0.人力検索はてなトップ
8.このページを友達に紹介
9.このページの先頭へ
対応機種一覧
お問い合わせ
ヘルプ/お知らせ
ログイン
無料ユーザー登録
はてなトップ