- 締切済み
JavascriptからPHPに値を受け渡したい
度々お世話になってます。 ドラッグ＆ドロップによるリスト間の並び替え結果の反映方法で悩んでいます。 <ul id=xxx><li id=x_1><li id=x_2>…</li><ul> <ul id=yyy><li id=y_1><li id=y_2>…</li><ul> という複数のリスト間をSortable.createを使用して動かしています。 この<ul>のidを取り出してPHPに送りたいのですが、なかなか上手くいきません。 <? $_SESSION["X"] = Sortable.serialize('xxx'); ?> 上記のようなプログラム等で試していますが、うんともすんとも言いません。 ご教授頂ければ幸いです。 よろしくお願いします。
- PHP
- 回答数1
- ありがとう数0
- みんなの回答 （1）
- 専門家の回答
みんなの回答
- nicolish
- ベストアンサー率72% (13/18)
関連するQ&A
- jquery sortableについて
２つのsortable要素があり、リスト１の特定の要素のみリスト２に移動できるようにできないでしょうか？ 下記のlist1のアイテム2のみlist2へ移動でき、アイテム１・アイテム３はlist1内でソートのみ。 <ul id="list1"> <li>アイテム1</li> <li>アイテム2</li> <li>アイテム3</li> </ul> <ul id="list2"> <li>アイテム4</li> <li>アイテム5</li> <li>アイテム6</li> </ul> $("#list1").sorable(); $("#list2").sorable();
- 締切済み
- JavaScript
- [LWP?] 特定のCLASSの値だけ取得したい
LWPを使って、特定のWebページを取得しました。 -- use LWP::UserAgent; $ua = LWP::UserAgent->new; $ua->agent("$0/0.1 " . $ua->agent); $req = HTTP::Request->new(GET => 'http://www.yahoo.co.jp/'); $req->header('Accept' => 'text/html'); # リクエストの送信 $res = $ua->request($req); # 出力のチェック if ($res->is_success) { print $res->content; #←ここが取得したあいたいです。 } else { print "Error: " . $res->status_line . "\n"; } -- この中から指定したclassのinnerTextだけ取得したいのですがどのようにしたらよいのでしょうか？ 要は$res->contentに -- <BODY> <UL> <LI class=aaa>xxx1</LI> <LI class=aaa>xxx2</LI> <LI class=aaa>xxx3</LI> </UL> <UL> <LI class=bbb>yyy1</LI> <LI class=bbb>yyy2</LI> <LI class=bbb>yyy3</LI> </UL> </BODY> -- のような値が入っていてclass=bbbの「yyy1」～「yyy3」だけ取得したいのですが。 よろしくお願い致します。 （参考）LWP http://homepage3.nifty.com/hippo2000/perltips/LWP.html
- ベストアンサー
- Perl
- JavaScript多重ループを使ったHTML生成
JavaScriptで以下のようなHTMLを生成したいと考えています。 <li>を任意の数で繰り返し処理して生成し、 さらにそれを任意の数で繰り返し処理して生成した<ul>に 紐づけるようにしたいと考えています。 <div id="index"> <ul> <li><div></div></li> <li><div></div></li> <li><div></div></li> ↓ <li>任意の数で繰り返し </ul> <ul> <li><div></div></li> <li><div></div></li> <li><div></div></li> ↓ <li>任意の数で繰り返し </ul> ↓ <ul>任意の数で繰り返し </div> 以下のようなスクリプトをjQueryを使って書いてみましたが、うまくできませんでした。 アドバイスいただけると大変助かります。 よろしくお願いいたします。 (function(x, y) { var i = 0, j = 0, x = x, y = y; var index = $("#index"); while(j < y) { var ul = $("<ul>"); ul.appendTo(index); while(i < x) { var li = $("<li>"); var div = $("<div>"); div.appendTo(li); li.appendTo(ul); i++; } j++; } })(5, 5);
- 締切済み
- JavaScript
- 画像のランダムチェンジとフェードイン効果
質問ですが、まず最初に失礼がありましたらお許し下さい。 http://oshiete1.goo.ne.jp/qa3495988.html での質問に関連していると思うので、例を引用させて頂きます。 横590px縦300のメイン画像があり、その横に横180px縦50pxの画像を６個にしての設置を行います。横の180px縦50px画像をロールオーバーにし、更にその画像にマウスを乗せた時に横590px縦300pxのメイン画像も同時に変えたい・・ ここまでは回答で納得したのですが、メイン画像を一定時間でランダムチェンジさせる事とメイン画像の変化時にフェードイン効果を与える事の２点に挌闘しています。過去の質問ログを全部調べましたが、ないものですね。 <html> <head> <title></title> <style type="text/css"> img{border:1px solid red;} #box0 { width:770px; height:300px; position:relative; } #box mainview{ position:absolute; top:0;left:0; } #box0 ul{ position:absolute; top:0;left:590px; list-style-type:none; margin:0; padding:0; } #box0 li{ margin:0; padding:0; } #box0 li img{ vertical-align:top; } </style> <script type="text/javascript"> function sample(obj,mode){ var images = obj.getElementsByTagName('img'); images[0].style.display = (mode)?'none':'inline'; images[1].style.display = (mode)?'inline':'none'; var idNo = images[0].id.match(/(\d)/); for(var x=document.getElementById('mainview').firstChild; x;x=x.nextSibling){ if(x.id){ if(!mode && x.id.match(/0/) || mode && x.id.match(idNo[1])) x.style.display = 'inline'; else x.style.display = 'none'; } } } </script> </head> <body> <div id="box0"> <span id="mainview"> <img src="xxx0" width="590" height="180" alt="xxx0" id="xxx0"> <img src="xxx1" width="590" height="180" alt="xxx1" id="xxx1" style="display:none;"> <img src="xxx2" width="590" height="180" alt="xxx2" id="xxx2" style="display:none;"> <img src="xxx3" width="590" height="180" alt="xxx3" id="xxx3" style="display:none;"> <img src="xxx4" width="590" height="180" alt="xxx4" id="xxx4" style="display:none;"> <img src="xxx5" width="590" height="180" alt="xxx5" id="xxx5" style="display:none;"> <img src="xxx6" width="590" height="180" alt="xxx6" id="xxx6" style="display:none;"> </span> <ul> <li onmouseover="sample(this,true)" onmouseout="sample(this,false)"> <a href=""><img src="yyy1" width="180" height="50" alt="yyy1" id="yyy1"><img src="zzz1" width="180" height="50" alt="zzz1" id="zzz1" style="display:none"></a></li> <li onmouseover="sample(this,true)" onmouseout="sample(this,false)"> <a href=""><img src="yyy2" width="180" height="50" alt="yyy2" id="yyy2"><img src="zzz2" width="180" height="50" alt="zzz2" id="zzz2" style="display:none"></a></li> <li onmouseover="sample(this,true)" onmouseout="sample(this,false)"> <a href=""><img src="yyy3" width="180" height="50" alt="yyy3" id="yyy3"><img src="zzz3" width="180" height="50" alt="zzz3" id="zzz3" style="display:none"></a></li> <li onmouseover="sample(this,true)" onmouseout="sample(this,false)"> <a href=""><img src="yyy4" width="180" height="50" alt="yyy4" id="yyy4"><img src="zzz4" width="180" height="50" alt="zzz4" id="zzz4" style="display:none"></a></li> <li onmouseover="sample(this,true)" onmouseout="sample(this,false)"> <a href=""><img src="yyy5" width="180" height="50" alt="yyy5" id="yyy5"><img src="zzz5" width="180" height="50" alt="zzz5" id="zzz5" style="display:none"></a></li> <li onmouseover="sample(this,true)" onmouseout="sample(this,false)"> <a href=""><img src="yyy6" width="180" height="50" alt="yyy6" id="yyy6"><img src="zzz6" width="180" height="50" alt="zzz6" id="zzz6" style="display:none"></a></li> </ul> </div> </body> </html> の中に何を追加すれば・・・ ご教授の程よろしくお願いします。
- ベストアンサー
- JavaScript
- javascriptを使った値受渡（アイフレーム）
javascriptを使って、診断テストを作っています。 htmlファイルの中の３つの選択肢の中から、 ひとつを選択すると、診断結果を表示させるための値が どんどん増えていくということを作りたいです。 【例】 ■ques1.html Q1.質問テキスト Ａ１、あああ（ポイント１） Ａ２、いいい（ポイント２） Ａ３、ううう（ポイント３） ■ques2.html Q２.質問テキスト Ａ１、あああ（ポイント１） Ａ２、いいい（ポイント２） Ａ３、ううう（ポイント３） →質問１、２で両方ともＡ１を選択したら、ポイント数は２になる。 いろいろ調べたところ、Cookieを使ったり、 URLにパラメーターを渡して値を受け渡せばいいのかなーと 思っているのですが、今回iframeを使ってファイルを呼び出しているため、 ＵＲＬが変わらず、中のiframeのみファイルが変わっていくことになります。 なので、どのようにしたらうまくいくのか分かりません。 お忙しい中お手数ですが、ご教授ください。 【現在のhtmlファイル】 ■ques1.html <script><!-- question = '質問１'; answer1 = '選択肢１'; answer2 = '選択肢２'; answer3 = '選択肢３'; document.write("<div class='text_catch'>"+question+"</div>"); document.write("<ul>"); document.write("<li id='list1'><a href='answer1.html'>"+answer1+"</a></li>"); document.write("<li id='list2'><a href='answer1.html'>"+answer2+"</a></li>"); document.write("<li id='list3'><a href='answer1.html'>"+answer3+"</a></li>"); document.write("</ul>"); //--></script> どうぞよろしくお願いします。
- ベストアンサー
- JavaScript
- CSS で li を float させる方法
リスト項目を横並びにfloatさせたいいんですが、 li {list-style:none url(../image/icon/article.png) inside;} と指定すると、floatできないようです。 どうすればlist-styleを指定したliをfloatさせることできますか？ コートは以下のようにしています。 よろしくお願いします。 【HTML】 <div class="YYY"> <ul> <li class="movie"><a href="">MOVIE</a></li> <li class="photo"><a href="">PHOTO</a></li> </ul> </div> 【CSS】 .YYY {margin:10px 0;} .YYY ul {margin:0px;padding:0px;} .YYY li.photo {float:left;list-style:none url(photo.png) inside;} .YYY li.movie {float:left;list-style:none url(article.png) inside;}
- ベストアンサー
- HTML
- javascriptに関する質問です。
このコードを簡単に説明してください。 なぜあまりが0になると、JSが動作するのかがわかりません。 （child childrenのあたりも自分の頭がごちゃごちゃしています） よろしくお願いします。 <html> <head> <title>Hello DOM !</title> </head> <body> <div id="wrap"> <ul class="list"> <li>1</li> <li>2</li> <li>3</li> <li>4</li> <li>5</li> <li>6</li> <li>7</li> <li>8</li> <li>9</li> <li>10</li> </ul> </div> <script type="text/javascript"> var children = document.querySelector("#wrap .list").children; for(var i=0;i<children.length;i++){ var child = children[i]; if(i%2){ child.style.backgroundColor = "#EEEEEE"; } } </script> </body> </html>
- ベストアンサー
- JavaScript
- ドラッグ＆ドロップでコンテンツを移動させる。(scriptaculaus)
お世話になります。 ドラッグ＆ドロップでコンテンツを自由に並び替えができるものを作ろうとしております。 以下のソースでドラッグ＆ドロップで並び替えが出来るのですが もう少し手を加えたいと思っております。 やりたい事 1.ドラッグ中(onmousedown状態）で、配置元の下に同じ大きさのボックス(破線：border-style: dashed)を表示。 2.ドラッグ中、順番が変化した時点(Sortable.createのonChange状態)で、配置先に選択した同じ大きさのボックス(破線：border-style: dashed)を表示。 かつ配置元で表示したボックスは消去。 つまりはgoogleのパーソナライズドホームと同じことが出来ればと思っております。 お忙しいところ申し訳ありませんが どうかご教授よろしくお願いいたします。 バージョン：scriptaculous-js-1.6.1 ソースを載せようと思ったら、文字数制限で引っかかってしましました。 のちに回答を頂いた後、補足で載せます。
- 締切済み
- JavaScript
- リストの最後にクラス名を追加したい
javascriptでリストタグ（li）の最後にクラス名を追加するにはどうしたらいいか教えて下さい。 htmlはこんな感じです。 <ul id="sample"> <li>リスト1</li> <li>リスト2</li> <li>リスト3</li> </ul> よろしくお願い致します。
- ベストアンサー
- JavaScript
- メニューの横スクロールバーを消したい
色々と探しても解決法が見つからないのでどなたかご教授いただけませんでしょうか。 ※無事表示されればそれでいいのでhtmlの記述方法についてのお叱りなどは勘弁して下さい。 ドロップダウンメニューをセンタリング表示しているのですが、 どうあっても横スクロールバーが出てしまいます。 下記サイトではoverflow:hiddenを使用すると書いていますが 使用するとドロップダウンが非表示になってしまうため難しいです。 http://www.coolwebwindow.com/csstips/csstechnic/000241.php 【html】 <div id="global-nav"> <ul class="menu" id="menu"> <li class="a">イメージ画像</a> <ul> <li>ドロップダウン</li> <li>ドロップダウン</li> <li>ドロップダウン</li> </ul> </li> <li class="a">イメージ画像</a> <ul> <li>ドロップダウン</li> <li>ドロップダウン</li> </ul> </li> <li class="a">イメージ画像</a> <ul> <li>ドロップダウン</li> </ul> </li> <li class="a">イメージ画像</a> <ul> <li><a href="dl-1.html">ドロップダウン</a></li> <li><a href="dl-2.html">ドロップダウン</a></li> <li><a href="dl-3.html">ドロップダウン</a></li> </ul> </li> </ul> </div> 【css】 div#global-nav { position:relative; width: 1000px; height: 40px; margin: 0 auto; background: #999; } ul.menu { position: relative; list-style:none; left:50%; float:left; margin:0; padding:0; text-align: left; } ul.menu * { margin:0; padding:0; } ul.menu a { display:block; color:#000; text-decoration:none; } ul.menu li.a { position: relative; left:-50%; float:left; } ul.menu ul { position:absolute; top:40px; left:0; background:#d1d1d1; display:none; opacity:0; list-style:none; } ul.menu ul li { position:relative; border-top:none; width:180px; margin:0; } ul.menu ul li a { display:block; padding:3px 7px 5px; background-color:#d1d1d1; } ul.menu ul li a:hover { background-color:#c5c5c5; } ul.menu ul ul { left:180px; top:-1px; } ul.menu .menulink { width:180px; } ul.menu .menulink:hover, ul.menu .menuhover { background:url(images/header_over.gif); } ul.menuの中のleft:50%を消すと横スクロールバーが消える事はわかったのですが、 それだと中央揃えにならないので…。 どうか宜しくお願いします！
- ベストアンサー
- HTML
