締切済み

パラメータが送信毎に変わる場合の渡された値の取得

2013/02/18 15:47

jQueryのAutoSuggertプラグインを使用したオートコンプリートを実装したいのですが、入力された値の取得方法が分かりません。 http://code.drewwilson.com/entry/autosuggest-jqu … 質問させていただきます。サンプルを見ながら試行錯誤して入力フォームの作り方は分かったのですが、入力された値の取得方法がわからず公式サイトも英語なので困っています。。警告ダイアログで入力されたものを表示させたいのですがその方法がわかりません。。できれば複数選択されていれば複数表示させたいです。ソースは以下のように書いています。「入力された値の表示」を押すとGETで値が送信されるようにななったのですが、パラメータが as_values_074=***** と_074とランダムな数字が余計に付加されてしまうようで、 GETされた値の取得ができないのです。困っています。。よろしくお願いいたします。 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html lang="ja"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <meta http-equiv="Content-Script-Type" content="text/javascript"> <meta http-equiv="Content-Style-Type" content="text/css"> <title>AutoSuggest jQuery Plugin</title> <script type="text/javascript" src="http://skuare.net/test/js/jquery-1.3.2.js"></scr … <script type="text/javascript" src="http://skuare.net/test/js/jquery.autoSuggest.js" … <link rel="stylesheet" href="http://skuare.net/test/css/autoSuggest.css" type="text/css"> <script type="text/javascript"> $(document).ready(function() { var data = {items: [ {value: "1", name: "Mick Jagger"}, {value: "2", name: "Johnny Storm"}, {value: "3", name: "Richard Hatch"}, {value: "4", name: "Kelly Slater"}, {value: "5", name: "Rudy Hamilton"}, ]}; $("input[type=text]").autoSuggest(data.items, {selectedItem: "name", searchObj: "name"}); }); </script> </head> <body> <h3>サンプル</h3> <form action="autosuggest.html" name="name" method="GET"> <input type="text" value=""> <input type="submit" value="入力された値の表示"> </form> <?php $as_values = $_GET['as_values']; echo '入力されたお名前は『'.$as_values.'』です。'; ?> </body> </html>

imachan0322
お礼率0% (0/1)

JavaScript
回答数1
ありがとう数0

みんなの回答 （1）
専門家の回答

みんなの回答

b0a0a
ベストアンサー率49% (156/313)

2013/03/16 07:33 回答No.1

その場しのぎの解決でいいならいろんなパターンで直せると思いますけどね一番いいのはオートコンプリートをやめて例えばセレクトボックスにすることだと思いますよ

関連するQ&A

PHPでレイティングバーの値を取得
下記のようなJQuery　スクリプトにおいて、レイティングバーの値を、PHP変数に取得するにはどうすればいいのでしょうか。ご指導お願い致します。ちなみに、 $manzokudo = $_POST['rating']; var_dump($manzokudo); で、ダンプしたところ、中身がNULLでした。【detail.php】 <link rel="stylesheet" type="text/css" href="jquery.rating.css"> <script type="text/javascript" src="jquery-2.1.3.js"></script> <script type="text/javascript" src="http://code.jquery.com/jquery-migrate-1.1.0.js"></script> <script type="text/javascript" src="jquery.rating.js"></script> <script type="text/javascript"> $(function () { // レーティングバーを有効化 $('.starbar').rating({ cancel: '消去', // 「キャンセル」ボタンのテキスト // ★アイコンをクリックした時の処理 callback: function(value){ // detail.phpに対してレイティングバーの値を送信 $.post( 'detail.php', { rating: value }, function(){ window.alert('「' + value + '」をつけました。'); } ); } }); }); </script> </head> <body> <?php $_POST[] ?> </body> </html>
- 締切済み
- JavaScript
スクレイピングした内容をvalue値に入れたい
下記のようなページがあります。 ++++++++++++++++++++++++++++++++++++++++++ 【http://hoge.ne.jp/index.html】 <html> <table border="1"> <tbody> <tr> <td class="class3">東京</td> </tr> </tbody> </table> </html> ++++++++++++++++++++++++++++++++++++++++++ 【出来たこと】上記の東京という文字を抜き出すスクレイピングページを作りました。 ****************************************** 【http://hogehoge.com/index.html】 <html> <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> <script type="text/javascript" src="./js/jquery.xdomainajax.js"></script> <script> url = 'http://hoge.ne.jp/index.html'; $.get(url, function(data){ var content4 = $(data.responseText).find('.class3').text(); $("#text4").text(content4); }); </script> <div id="text4"></div> </html> 結果　→　東京 ************************************** 【出来なかったこと】これを、<input type="text" name="tx" value="東京">　のような形でフォーム内に取り入れることを考えています。しかしながら、下記のようにうまくいきません。 ●●だめ　その1●● <html> <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> <script type="text/javascript" src="./js/jquery.xdomainajax.js"></script> <script> url = 'http://hoge.ne.jp/index.html'; $.get(url, function(data){ var content4 = $(data.responseText).find('.class3').text(); $("#text4").text(content4); }); </script> <input type="text" name="tx" value="<div id='text4'></div>"> </html> 結果　→　表示されず ●●だめ　その2●● <html> <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> <script type="text/javascript" src="./js/jquery.xdomainajax.js"></script> <script> url = 'http://hoge.ne.jp/index.html'; $.get(url, function(data){ var content4 = $(data.responseText).find('.class3').text(); $("#text4").text(content4); }); var tx4 = content4; document.write("<input type='text' name='tx' value='" + tx4 + "' />"); </script> </html> 結果　→　表示されず【お願いしたいこと】 <input type="text" name="tx" value="東京">の形で表示させる方法についてアドバイスいただきたくお願いいたします。
- ベストアンサー
- JavaScript
javascriptでselectboxのvalueを取得し、特定のv
javascriptでselectboxのvalueを取得し、特定のvalue値により、「<input type="text" name～>」をブラウザに表示させたいのですが、やり方がわかりません。 javascriptについて素人です。 jQUERYを使用して、phpのようにif文を追加したらいけるのかなと思って下記のようにやってみたのですが、更新しないと変わりませんでした。。どなたかお力を貸して下さい！どうか宜しくお願い致します！ ========================================== <head> <meta http-equiv="Content-Type" content="text/html; charset=euc-jp" /> <meta name="robots" content="noindex,nofollow" /> <meta http-equiv="Content-Script-Type" content="text/javascript" /> <script type="text/javascript" src="/admin/js/jquery-1.2.3.js" ></script> <script type="text/javascript"> $(function() { hogehoge = $("#abcdefg").val(); if(hogehoge !== '3'){ $('#hijklmn').hide(); } }); </script> </head> <body> <form method="post" action="/admin/～"> <select id="abcdefg"> <option value="1">aaaaaaaa</option> <option value="2">bbbbbbbb</option> <option value="3">cccccccc</option> </select> <div id="hijklmn"> 上のセレクトボックスが3の場合のみ、下記のフォームを表示させたい <input type="text" value="ああああああああ" /> </div> </form> </body> </html>
- ベストアンサー
- JavaScript
スクレイピングで取得した文字を変数表示
javascriptでiphoneアプリを作成中です。ゲームにあたり、自社サーバーのhoge.ne.jp/read1000.php上のデータベース情報をスクレイピンクしてiphone上で表示させます。下記により、「hoge.ne.jp/read1000.php」にあるソースの中から「吉本」の文字をスクレイピング表示することが可能です。 ****【hoge.ne.jp/read1000.php】(DBサーバー)******************** 　　　　　　<td class="class3_sql_name">吉本</td> ****【hogehoge.com/index.html】(iphone仮想サーバー)************** 　 <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> <script type="text/javascript" src="./js/jquery.xdomainajax.js"></script> <script> url = 'http://hoge.ne.jp/read1000.php'; $.get(url, function(data){ var content3_sql_name = $(data.responseText).find('.class3_sql_name').text(); $("#text3_sql_name").text(content3_sql_name); }); </script> <div id="text3_sql_name"></div>　 //←この部分にhoge.ne.jpからスクレイピング　　　　　　　　　　　　　　　　　　　　　　した吉本の文字が表示される ************************************************************ やりたいことここで取得できた「吉本」の文字を変数としてjavascript上で表示させたいと考えています。下記のようにしたのですがグローバル変数、ローカル変数とも表示出来ません。どうすれば表示できるでしょうか? ****【hogehoge.com/index.html】(iphone仮想サーバー)************* <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> <script type="text/javascript" src="./js/jquery.xdomainajax.js"></script> <script> url = 'http://hoge.ne.jp/read1000.php'; $.get(url, function(data){ var content3_sql_name = $(data.responseText).find('.class3_sql_name').text(); $("#text3_sql_name").text(content3_sql_name); //テスト用としてグローバル変数追加 content3=$("#text3_sql_name").text(content3_sql_name); }); </script> <script> document.write(""+content3_sql_name+""); </script> <script> document.write(""+content3+""); </script> 　↑上記のふたつとも表示出来ない宜しくお願い致します。
- 締切済み
- JavaScript
ジャバスクリプトが作動しません。
初めまして、素人なので的外れな質問だったら恐縮です。以下のようにジャバスクリプトを2つ記述しましたが、後ろに記述した１つしか作動しません。記述の順番を入れ替えても、やはり後ろに記述した方しか作動しません。何が悪いのか、どなたか教えて頂けますでしょうか？ <head> <meta http-equiv="Content-Type" content="text/html; charset=shift_jis" /> <meta http-equiv="Content-Style-Type" content="text/css" /> <meta http-equiv="Content-Script-Type" content="text/javascript" /> <title>ホームページテンプレート</title> <meta name="description" content="説明を入れます" /> <meta name="keywords" content="キーワード" /> <link href="css/style.css" rel="stylesheet" type="text/css" /> <script type="text/javascript" src="js/script.js"></script> <link href="css/gallery11.css" rel="stylesheet" type="text/css" media="screen" /> <script type="text/javascript" src="js/prototype.js"></script> <script type="text/javascript" src="js/effects.js"></script> <script type="text/javascript" src="js/glider.js"></script> <script type="text/javascript"></script> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script> <script type="text/javascript"> $(function(){ var setImg = '#viewer'; var fadeSpeed = 1500; var switchDelay = 5000; $(setImg).children('img').css({opacity:'0'}); $(setImg + ' img:first').stop().animate({opacity:'1',zIndex:'20'},fadeSpeed); setInterval(function(){ $(setImg + ' :first-child').animate({opacity:'0'},fadeSpeed).next('img').animate({opacity:'1'},fadeSpeed).end().appendTo(setImg); },switchDelay); }); </script> </head>
- ベストアンサー
- JavaScript
jquery.bgSwitcherが設置できない
私は、いまbgSwitcherの設置ができなくて悩んでいます。「fadeOut」を利用したいのですが、画像は表示されるのですが、そこから何も動きません。だれか分かる方がいらっしゃれば是非教えていただきたいので、宜しくお願いします。 ▼私の現在の状況************************************************************ <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <TITLE>○○○</TITLE> <META name="keywords" content="○○○"> <META name="description" content="○○○"> <meta name="robots" content="all" /> <link href="css/style.css" rel="stylesheet" type="text/css" media="all" /> <script type="text/javascript" src="js/script.js"></script> <script type="text/javascript" src="js/lightbox/js/prototype.js"></script> <script type="text/javascript" src="js/lightbox/js/scriptaculous.js?load=effects"></script> <script type="text/javascript" src="js/lightbox/js/lightbox.js"></script> <link rel="stylesheet" href="js/lightbox/css/lightbox.css" type="text/css" media="screen"> <script type="text/javascript" src="js/jquery.js"></script> <script type="text/javascript" src="js/jquery.bgSwitcher.js"></script> <script> jQuery(document).ready(function($) { $('#fadeOut').bgSwitcher({ images: ['images/image1.jpg','images/image2.jpg','images/image3.jpg','images/image4.jpg'], interval: 2000 }); }); </script> </head> <body> <div id="wrap"> <div id="container"> | 途中は省略 ↓ <div id="fadeOut" class="bg"><p><img src="images/top_main.png" width="670" height="450" /></p></div> | ↓ 以下省略。ちなみに「class="bg"」は、 .bg { 　width: 640px; 　height: 415px; 　margin: 0; 　padding: 0; } こういった感じです。 *************************************************************************** これで、なぜ動かないのでしょうか？このプラグインは、jquery.bgSwitcher.js 自体を何か編集する必要があるのでしょうか？開発された方のサイトを隅から隅まで見ても分かりませんでした。 ▼開発者様のサイト http://rewish.org/javascript/jquery_bg_switcher ちなみに、jQueryのバージョンは、jquery-1.7.1.minです。どなたか、ご助力をお願い致します。
- 締切済み
- JavaScript
thickbox.js使用時のフォームの取得方法をご教授願います。
thickbox.jsを使用しているページでセレクトの値をPHPに渡したいと考えているのですが、値の取得の仕方がわからず困っております。ソースは以下のようなカンジです。 [値を取得]を押下した時セレクトボックスの値を取得しようとしています。Firebugでは以下のようにエラーがでます。 document.FrmThick.PrefectureCD has no properties どなたかアドバイス頂けますでしょうか？ ----------------------------------------------------- <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=shift_jis"> <title>Sample</title> <link rel="stylesheet" href="thickbox.css" type="text/css"> <script type="text/javascript" src="jquery.js"></script> <script type="text/javascript" src="thickbox.js"></script> </head> <body> <a href="#TB_inline?height=300&width=600&inlineId=condition" class="thickbox" title="条件を設定してください">ThickBoxについて</a> <style> #condition { visibility:hidden; } </style> <script> function test (){ alert(document.FrmThick.PrefectureCD.value); } </script> <div id="condition"> <form action="" method="get" name="FrmThick" id="FrmThick">  <select id="PrefectureCD" name="PrefectureCD"> <option value="1">北海道</option> <option value="2">青森県</option> </select> <a href="javascript:test();">値を取得</a>  </form> </div> </body> </html>
- ベストアンサー
- JavaScript
jquery複数のcheckboxの値について
どうも、はじめまして、jqueryに興味をもった初心者です。 jqueryを利用で、phpファイルにcheckboxの値を渡し、loadでphpファイルを読み込みたいのですが、うまくいきません。。ご存知の方いましたら、お手数ですが、教えてください。。環境、php5.1,jquery1.4, ソース  <html> <head> <script type="text/javascript" src="jquery.js"></script> <script type="text/javascript" src="chk.js"></script> <title></title></head> <body> <input type="checkbox" name="test[]" id="test" value="1">test1 <input type="checkbox" name="test[]" id="test" value="2">test2 <input type="checkbox" name="test[]" id="test" value="3">test3 <input type="checkbox" name="test[]" id="test" value="4">test4 <input type="submit" value="sub" id="sub"> <div id="hbox">ここにロードしたい</div> </body> </html> //chk.js --------------------------- $(function(){ $("#sub").click(function () { var chk = $(".@test:checkbo[name^='test[]']:checked") .val(); $("#hbox").load("form.php",{test:chk}); }); }); //form.php ---------------------------- <?php echo htmlentities( print_r($_GET, true) ); ?> 以上がソースです。。。このソースだと、 checkを入れた値１つしか、phpに渡すことができません。。 checkを入れた値をすべて、phpに渡し、loadしたいのですが、方法が分からず困ってます。ご存知の方いましたら、お手数ですが、分かりやすく、教えていただけませんでしょうかお願いいたします。
- ベストアンサー
- JavaScript
crossSlideがうまく機能しないです；
簡単な画像切り替えのプラグインとして、 crossSlideを見つけたので使用してみようとしたんですが、全く何も表示されない状態で困っています。下記のようにソースは記載しています。 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja"> <head> <meta http-equiv="content-type" content="text/html; charset=UTF-8" /> <meta http-equiv="content-language" content="ja" /> <title></title> <meta name="description" content="" /> <meta name="keywords" content="" /> <meta http-equiv="content-style-type" content="text/css" /> <meta http-equiv="content-script-type" content="text/javascript" /> <link href="css/base.css" rel="stylesheet" type="text/css"> <link href="css/index.css" rel="stylesheet" type="text/css"> <script type='text/javascript' src='js/jquery-1.9.1.min.js'></script> <script type='text/javascript' src='js/jquery.cross-slide.js'></script> <script type="text/javascript"> $(function(){ $('#mainvisual').crossSlide({ sleep: 1, fade: 1 },[ { src: 'images/01.jpg' }, { src: 'images/02.jpg' }, { src: 'images/03.jpg' } ]); }); </script> </head> <body> <p>タイトル</p> <div id="mainvisual"> <p>写真</p> </div> </body> </html> cssは何も指定していません。 jsフォルダに、jquery-1.9.1.min.jsファイル、jquery.cross-slide.jsファイルを入れています。 imagesフォルダには、01.jpg、02.jpg、03.jpgを入れてます。ブラウザには <p>タイトル</p> は表示されるのですが、 div#mainvisualの中の <p>写真</p>の文字は表示されません。何が原因なのでしょうか。よければアドバイスの方よろしくお願いします。
- ベストアンサー
- JavaScript
教えてください!　lightboxとskitter
javascriptがまだよく理解できていないので、愚問に思われるかもしれないですが、上手く動作しなくて困っています。 <head>内に下記のように記述したのですが、lightboxが上手く作動しません。記述に問題があるんでしょうが、調べても全くわからないのでこちらに投稿させていただきました。どなたかこの問題の解き方をお教えください。よろしくお願いします。 <link rel="stylesheet" type="text/css" href="css/lightbox.css">  <script src="js/prototype.js" type="text/javascript"></script> <script type="text/javascript" src="js/builder.js"></script> <script type="text/javascript" src="js/effects.js"></script> <script type="text/javascript" src="js/lightbox.js"></script> <script type="text/javascript" src="js/smartRollover.js"></script>  <script type="text/javascript" src="js/jquery.quickflip.source.js"></script> <link rel="stylesheet" type="text/css" href="css/skitter_css/skitter.styles.css">  <style type="text/css"> .box_skitter_large{ width:490px;height:190px; } </style> <script type="text/javascript" src="js/skitter_js/jquery-1.5.2.min.js"></script> <script type="text/javascript" src="js/skitter_js/jquery.skitter.js"></script> <script type="text/javascript" src="js/skitter_js/jquery.easing.1.3.js"></script> <script type="text/javascript" src="js/skitter_js/jquery.animate-colors-min.js"></script> <script type="text/javascript"> $(function(){ $('.box_skitter_large').skitter({interval: 8000});  //$('.box_skitter_large').skitter({thumbs: true, label: false,}); }); </script>
- ベストアンサー
- JavaScript

パラメータが送信毎に変わる場合の渡された値の取得

みんなの回答

関連するQ&A

注目のQ&A

カテゴリ
一覧

専門家に質問してみよう
専門家登録

あなたにピッタリな商品が見つかる！ OKWAVEセレクト

パラメータが送信毎に変わる場合の渡された値の取得

みんなの回答

関連するQ&A

注目のQ&A

カテゴリ 一覧

専門家に質問してみよう 専門家登録

あなたにピッタリな商品が見つかる！ OKWAVEセレクト

カテゴリ
一覧

専門家に質問してみよう
専門家登録