🎄teratailクリスマスプレゼントキャンペーン2024🎄』開催中!

\teratail特別グッズやAmazonギフトカード最大2,000円分が当たる!/

詳細はこちら
PHP

PHPは、Webサイト構築に特化して開発されたプログラミング言語です。大きな特徴のひとつは、HTMLに直接プログラムを埋め込むことができるという点です。PHPを用いることで、HTMLを動的コンテンツとして出力できます。HTMLがそのままブラウザに表示されるのに対し、PHPプログラムはサーバ側で実行された結果がブラウザに表示されるため、PHPスクリプトは「サーバサイドスクリプト」と呼ばれています。

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

Ajax

Ajaxとは、Webブラウザ内で搭載されているJavaScriptのHTTP通信機能を使って非同期通信を利用し、インターフェイスの構築などを行う技術の総称です。XMLドキュメントを指定したURLから読み込み、画面描画やユーザの操作などと並行してサーバと非同期に通信するWebアプリケーションを実現することができます。

HTML

HTMLとは、ウェブ上の文書を記述・作成するためのマークアップ言語のことです。文章の中に記述することで、文書の論理構造などを設定することができます。ハイパーリンクを設定できるハイパーテキストであり、画像・リスト・表などのデータファイルをリンクする情報に結びつけて情報を整理します。現在あるネットワーク上のほとんどのウェブページはHTMLで作成されています。

Q&A

1回答

1006閲覧

【Ajax】アクションを実行してもレスポンスがない

jin007

総合スコア34

PHP

PHPは、Webサイト構築に特化して開発されたプログラミング言語です。大きな特徴のひとつは、HTMLに直接プログラムを埋め込むことができるという点です。PHPを用いることで、HTMLを動的コンテンツとして出力できます。HTMLがそのままブラウザに表示されるのに対し、PHPプログラムはサーバ側で実行された結果がブラウザに表示されるため、PHPスクリプトは「サーバサイドスクリプト」と呼ばれています。

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

Ajax

Ajaxとは、Webブラウザ内で搭載されているJavaScriptのHTTP通信機能を使って非同期通信を利用し、インターフェイスの構築などを行う技術の総称です。XMLドキュメントを指定したURLから読み込み、画面描画やユーザの操作などと並行してサーバと非同期に通信するWebアプリケーションを実現することができます。

HTML

HTMLとは、ウェブ上の文書を記述・作成するためのマークアップ言語のことです。文章の中に記述することで、文書の論理構造などを設定することができます。ハイパーリンクを設定できるハイパーテキストであり、画像・リスト・表などのデータファイルをリンクする情報に結びつけて情報を整理します。現在あるネットワーク上のほとんどのウェブページはHTMLで作成されています。

0グッド

3クリップ

投稿2019/09/22 00:50

編集2019/09/28 10:12

◆前書き
業務で全く経験したことのないAjaxをお願いされて勉強を始めました。

◆実現したいこと
このサイトのように
1と打てば→「田中」
2と打てば→「佐藤」
と出るようにしたい。

◆現状
1、2は打てるが送信を押してもレスポンスがなく返却値もない。

ディレクトリ構造も同じ階層に
index.html、sample.phpファイルを置いているので問題ないかと思います。


本日より学習を始めたのですが、環境?なのかエラーログを吐くわけでもないので何卒お力添えいただけたらと思います。

以上、よろしくお願いいたします。


◆追記

Fiddler を入手して、要求・応答をキャプチャして・・・

⇒入手いたしました。
送信ボタンを押しているのですが、Fiddler上何も表示されないのでおそらく叩けていないのだなと思いました。

タグにphpも設定しておいた方が・・・

⇒ご指摘ありがとうございます。追加いたしました。

あなた自身が書かれているコード・・・

⇒記載いたしました。参考にしているサイトと同じコードになります。

◆コード
同じディレクトリ配下に、
・index.html
・sample.php

▼index.html

HTML

1<!DOCTYPE html> 2<html lang="ja"> 3<head> 4 <meta charset="utf-8"> 5 <title>ajax</title> 6</head> 7<body> 8<h1>jquery.get()</h1> 9 10<label>ID:<input type="number" name="name" value=""></label> 11<input type="button" value="送信"> 12<p>名前:<span></span></p> 13 14<script src="//code.jquery.com/jquery-3.1.1.min.js"></script> 15<script> 16$(function() { 17 18 $("[type=button]").on("click", function() { 19 20 $.get("sample.php", { 21 id : $("[type=number]").val() 22 }, function(data) { 23 $("span").text(data); 24 }); 25 26 }); 27 28}); 29</script> 30</body> 31</html>

▼sample.php

php

1<?php 2switch ($_GET['id']) { 3 case 1: 4 echo "田中"; 5 break; 6 case 2: 7 echo "佐藤"; 8 break; 9 default: 10 echo "なし"; 11 break; 12}

◆phpの環境が自分のPCに無かったので・・
このサイトを参考にphpの環境を作りました。

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

退会済みユーザー

退会済みユーザー

2019/09/22 02:40

とりあえず Fiddler を入手して、要求・応答をキャプチャして、中身がどうなっているか調べてみてください。そこにヒントが見つかると思います。(Fiddler でなくでもブラウザのディベロッパーツールなどでもキャプチャできますが、Fiddler が使いやすいので絶対的にお勧めです)
siruku6

2019/09/22 09:35

タグにphpも設定しておいた方が、よくわかっている人の目に留まると思います。 私はphpはわからないため力にはなれませんが、書いておけばphpが得意な人が見てくれる可能性が上がると思います。
mari.rinn

2019/09/23 10:13

あなた自身が書かれているコードを全てのファイル分記載してください。
jin007

2019/09/28 10:12

遅くなり申し訳ございません。 本業で他のことをしていたためこちらの勉強する時間が取れずにいました。 追記いたしましたので見てくださるとうれしいです。
shun-K

2019/09/28 17:01

Ajaxはともかく、PHPはちゃんと動いてますでしょうか? ブラウザで http://localhost/sample.php?id=1 にアクセスすると 「田中」が表示されますか? (http://localhost:8000/ とかかもしれませんが) https://sastd.com/php-easy-environment/ ここにWEBサーバに関する記載がないような。 WEBサーバは起動してますか? index.htmlへはどういうURLでアクセスしてますか? C:\Temp\index.html とかだったらまずjqueryが読み込めないと思います。 (//始まりのプロトコル省略なので file://code.jquery.com/jquery-3.1.1.min.js にアクセスしてしまう)
FKM

2019/10/01 09:18

VMに載せてみたら普通に動きました。プログラムには何も問題ないようです 環境の問題ですかね?
kyoya0819

2019/10/02 05:40

他の回答者のコメントにあるようにjQueryのパスミスでは? 一時期 //sample.com の書き方はGoogleから推奨されていましたが今現在では https://example.com という書き方が推奨されています。
guest

回答1

0

XAMPP上で動作させたところ正しく動いていたので、コードには問題なさそうです。
jQueryのタグを削除またはphpファイルを削除したところ同様の状況(入力はできるが送信ができていない)が再現できましたので、①jQueryを読み込めていない または ②phpが実行できていない ことが原因と思われます。
いずれにせよ実行環境を見直してみるとよいかもです。

投稿2019/10/03 08:59

shiramiso

総合スコア25

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

まだベストアンサーが選ばれていません

会員登録して回答してみよう

アカウントをお持ちの方は

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.36%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問