• ベストアンサー

リスト内のアイテムをプログラムで選択・ハイライトするには？

とほほさんのJavaScript マニュアルサイトにつぎのような説明があります。 ■ フォーム部品（セレクト部品） ◆ window.document.form.select.selectedIndex (e3/N2) 現在選択されているオプションオブジェクトを示すインデックス番号（0～）を示します。これに値を代入することにより、セレクションボックスの選択項目を変更することができます。 わたしはそこで、 <?myFORM.listbox.selectedIndex=$j; ?> として、表示されているアイテムの中から、変数$j の番号に一致するアイテムを選択・ハイライトさせたいのです。どういうPHPスクリプトを書けばよろしいのでしょうか？

  • PHP
  • 回答数4
  • ありがとう数4

質問者が選んだベストアンサー

  • ベストアンサー
  • shi-_-na
  • ベストアンサー率100% (3/3)
回答No.3

ちょっとこんがらがってきました。 php上で$jを設定し その$j番目を選択（ハイライト）状態にするということ でしたら一番最初に記述したサンプルで行けると思います。 「無前提にJSで受け取って代入」というより phpのechoやprint文でHTML&javascript文を出力 ってことになると思います。なぜならphpはページ を表示時に実行されるからです。 そちらの要望をまとめていただけたら嬉しいです。 あと、プログラム全般そうですが試さないで できるか心配で聞くより、試してみてできるか できないかやっておいたほうが勉強になりますよ。

その他の回答 (3)

  • duckling
  • ベストアンサー率47% (88/185)
回答No.4

PHPは「サーバサイドスクリプト」 つまり、サーバ側ですべて処理され、 閲覧者のもとには PHP が成形したHTMLが届けられます。 JavaScript は「クライアントサイドスクリプト」 閲覧者のもとに届けられた後、ブラウザが実行します。 PHPで「正しいHTML」と「正しいJavaScript」を準備してあげてから 閲覧者にお届けすれば、あとはブラウザが処理してくれます。 JavaScriptの出番は、サーバが処理を終えたその後です。 <? myFORM.listbox.selectedIndex=$j; ?> ↑このソースは　 「PHPを記述する場所」に「JavaScriptを記述している」ので、 エラーが出ているのです。 「myFORM.listbox.selectedIndex」は、 JavaScript で、PHPの文章ではありません。 書くとしたら、 myFORM.listbox.selectedIndex=<?= $j; ?>; ですね。 $j が 123 だとしたら、 myFORM.listbox.selectedIndex=123; に変換されて、閲覧者のところに届きます。

  • shi-_-na
  • ベストアンサー率100% (3/3)
回答No.2

phpというよりjavascriptのほうですね。 少々検索エンジンで調べてサンプルを作成して みました。いかがでしょうか？ <html> <head> </head> <body> <form action="データの送り先" name="F1"> <select name="S1"> <option value="AAA">AAA</option> <option value="BBB">BBB</option> <option value="CCC">CCC</option> <option value="DDD">DDD</option> </select> <input type="button" onclick="document.F1.S1.options[0].selected=true;" value="1番目を選択"> <input type="button" onclick="document.F1.S1.options[1].selected=true;" value="2番目を選択"> <input type="button" onclick="document.F1.S1.options[2].selected=true;" value="3番目を選択"> <input type="button" onclick="document.F1.S1.options[3].selected=true;" value="4番目を選択"> <BR><BR> <input type="text" name="T1">番目を<input type="button" onclick="document.F1.S1.options[document.F1.T1.value - 1].selected=true;" value="選択"> </form> </html>

tonka729
質問者

お礼

またご回答をいただきありがとうございました。早速test.phpとしてやってみました。たしかに私の希望通りのことが実現されています。 　ただ、テキストフィールドに数字を入力すると言うより、私の場合、phpで書いた数行で$j という値（=リストアイテムの番号）を動的に得ており、それをF1,S1のオプション選択番号として代入したいのです。手入力でなく。。。うーん、ちょっとした違いがあるように思うのですが、ｐｈｐの知識があまりないので困りました。 　次に、この部分をご指摘のようにＪＳだけで書こうとする場合、同一ソースファイル内のPhp行から得ている値（変数、配列）は、そのまま無前提にJSで受け取って、代入などして有意味に働いてくれるのですか？やらないうちから心配してます。。。 　よろしく御教示をお願いします。

  • shi-_-na
  • ベストアンサー率100% (3/3)
回答No.1

値を入力して（ページが変わって）の表示ですか？ それならJavaScriptを用いない方法で私はやっていますので一応その方法を書かせてもらいます。 例ソース <? // 値を取得 $i=$_POST['value']; // 値がセットされてなければ入力画面を表示 if(!isset($i)) { echo <<<EOF <form action="#" method="POST"> 選択したい要素: <input type="text" name="value"> <input type="submit"> </form> EOF; } else { // オプションの項目 $option = Array('AAA','BBB','CCC','DDD'); echo "<form>\n<select>\n"; $j = 0; while($j != count($option)-1) { if($j == $i) echo "<option selected>".$option[$j]; else echo "<option>".$option[$j]; $j++; } echo "</select>\n</form>\n"; } ?>

tonka729
質問者

お礼

shi--na さま、お教え頂き、ありがとうございました。 私の説明が不足しており、失礼しました。 私の場合：オプションメニュー・クリックにはすでにたくさんアイテムが書き込まれているという状態で、かつ、変数$j の値はすでに動的に与えられているという前提です。 その上で、とほほさんのJavaScriptのselected の解説にあるように： window.document.form.select.selectedIndex =$j　というふうにして値を代入したいのですが、phpだとparseエラーが出ました。 つまり同じ画面上のメニュー内の一つのアイテムを選択・ハイライトさせたいのです。 ｐｈｐは始めたばかりですので難しいことは分かりません。。。やさしい例でお教え頂けますでしょうか？

  1. カテゴリ
  2. [技術者向] コンピューター
  3. プログラミング・開発
  4. PHP

関連するQ&A

  • リストボックスのアイテムをマウスで並べ替えたいです

    リストボックスのアイテムをマウスのドラッグドロップで並べ替えたいのですが、 下のような感じで書いてみたのですが、 この状態だと、４番目のものを一番上に持ってくるという動作だけするのですが、 ４番目から３番目に移動する場合や、１番目から３番目に移動する場合など 追加していくとIFが重なってきてすごくややこしくなってしまいます。 もっと分かりやすくて合理的な方法がありましたら、 大体でも良いですので、教えて頂けたら助かります。 よろしくおねがいいたします。 Private Sub Form1_Load(...略 ListBox1.Items.Add("ＡＡＡ") ListBox1.Items.Add("ＢＢＢ") ListBox1.Items.Add("ＣＣＣ") ListBox1.Items.Add("ＥＥＥ") End Sub Private Sub ListBox1_MouseDown(...略 SelectedSortFrom = ListBox1.SelectedIndex End Sub Private Sub ListBox1_MouseUp(...略 SelectedSortTo = ListBox1.SelectedIndex ListBox1Sort(SelectedSortFrom, SelectedSortTo) End Sub Private Function ListBox1Sort(ByVal From As Integer, ByVal Too As Integer) If From = -1 Then Exit Function If Too = -1 Then Exit Function Dim A(ListBox1.Items.Count) As String Dim B As Boolean For i As Integer = 0 To ListBox1.Items.Count - 1 A(i) = ListBox1.Items(i) Next For i As Integer = 0 To ListBox1.Items.Count - 1 If i = Too Then ListBox1.Items(i) = A(From) B = True Else ListBox1.Items(i) = A(i - 1) End If Next End Function

  • リストボックスの複数選択時のダブルクリックについて

    リストボックスをMultiExtendedで設定してあり、 複数を選択した状態でその選択されているどれかのアイテムを ダブルクリックすると選択されている全てのアイテム（番号）を 取得したいのですが、どのようにしたらできるでしょうか。 ListBox1_SelectedIndexChangedで複数選択アイテム番号を記憶させて 次にダブルクリックした際に、そのアイテム番号が記録の中の番号に 含まれていれば、記録してある番号のアイテムを全部取得して、 その後で、その記録されていた番号のアイテムを全部選択状態に 設定すればダブルクリックしたように見えると思ったのですが、 ダブルクリックの一回目のクリックでListBox1_SelectedIndexChanged イベントが 発生してしまい、複数選択の記録が消えてしまいます。 フラグを立てたりと色々試しているのですが、どうもうまく動作してくれません。 良い方法やヒントがありましたら、ご教授頂けると幸いです。 ＶＢ．ＮＥＴ2003、Framework1.1環境です。

  • 新しい窓を開く記述がblankで上手くいかないです。

    <!-- function myGo(){ mySelect = document.myForm.myMenu.selectedIndex; top.MainFrame.location.href = document.myForm.myMenu.options[mySelect].value; } // --> 上のJavaScriptで、下のformで選択されたページをMainFrameに表示しています。 今回、選択したページを新しい窓で表示したいのですが、locationの 前にblankを書き加えても飛びません。 どの様に記述すればいいのでしょうか？ご指導よろしくお願いします。 <FORM name="myForm"> <select name="myMenu" onChange="myGo()"> <OPTION value="ｈttp://---1">◆1 <OPTION value="ｈttp://---2">◆2 <OPTION value="ｈttp://---3">◆3 </SELECT> </FORM>

  • リストボックスからジャンプさせた後のフォーカス

    リストボックスで選択してＵＲＬに飛ばしていますが、元のページのリストボックスのアイテムが選択状態になっていているので、そのフォーカスをなくすにはどうしたらいいでしょうか。 function menujump_flm(targ,selObj,restore){ if(targ=="_blank"){ window.open(selObj.options[selObj.selectedIndex].value,"_blank"); } else { eval(targ+".location='"+selObj.options[selObj.selectedIndex].value+"'"); } [selObj.selectedIndex].value+"'"); } <select name="sl" onChange="menujump_flm('_blank',this,1)"> <OPTION value="***">文書1</OPTION> <OPTION value="***">文書2</OPTION> <OPTION value="***">文書3</OPTION> </SELECT>

  • セレクトメニューでジャンプしたページを新しいWindowで表示したい

    リンク先をセレクトメニューで選んでもらって、そのページ内に開く方法は色々なJavaScriptを紹介しているページで見せていただいたのですが、同じWindowではなく、新しいWindowを開いてそこに表示したいのです。 下記は同じWindow内に開いてしまいますが、現在はこのようなカンジで使用しています。 <form> <select onChange="location=this.options[this.selectedIndex].value"> <option value="">選択して下さい <option value="test1.html">TEST-1 <option value="test2.html">TEST-2 <option value="test3.html">TEST-3 </select> </form> 宜しくお願いしますm(_ _)m

  • hiddenに値を設定する方法

    いつもお世話になります。 selectboxの選ばれている項目の番号、いわゆるselectedIndexをhiddenに設定してsubmitで取得したいのですが、エラーがでてしまいます。 いまいちhiddenの使い方もわかっていないので見当違いな書き方をしているかもしれませんが、 現在の状態を以下に示しますのでご指導よろしくお願いします。 [javascriptの中] function err(){ document.myForm.NaNo.value = myForm.cbName.selectedIndex; } [htmlの中] <body onLoad=err()> <form name="myForm" method="post"> <select name="cbName"> <option value=""><br></option> <option value="花子">花子 <option value="和子">和子 <option value="良子">良子 </select> <input type="hidden" name="NaNo">

  • リストボックスを連動させて・・・その２

    直前の質問で下記の回答をいただいたものです。 質問では２つのリストボックスを連動させたサンプルの回答をいただきましたが、ひょっとして、リストボックスの個数が何個でも対応させることはできないでしょうか。つまり、リストボックスのnameなどをscript部分に記さずに・・。 ここまでサンプルをもらっても改造できないので質問。 (^^; ■JavaScript <SCRIPT language=JavaScript> <!-- strBase = "test.cgi?hinmei=denwa "; strS1 = "&s1="; strS2 = "&s2="; function set(){ 　strS1b = strS1 　strS2b = strS2 　　if (document.form.s1.options[document.form.s1.selectedIndex].value) 　　strS1b += document.form.s1.options[document.form.s1.selectedIndex].value; 　if (document.form.s2.options[document.form.s2.selectedIndex].value) 　　strS2b += document.form.s2.options[document.form.s2.selectedIndex].value; 　strURL = strBase + strS1b + strS2b; 　document.form.text.value = strURL; } //--> </SCRIPT> ■フォーム <FORM NAME="form"> <select name="s1" onChange="set()"> <OPTION VALUE="" SELECTED>↓【選択して下さい】</OPTION> <OPTION VALUE="big">big</OPTION> <OPTION VALUE="small">small</OPTION> </SELECT> <select name="s2" onChange="set()"> <OPTION VALUE="" SELECTED>↓【選択して下さい】</OPTION> <OPTION VALUE="red">red</OPTION> <OPTION VALUE="white">white</OPTION> </SELECT> <INPUT TYPE="text" SIZE=50 NAME="text"> </FORM>

  • 選択されたメニューアイテムの番号は？

    以下のようなフォームの送信をCGIプログラムで受けた時、フォーム部品の一つのオプションメニューの洗濯されたアイテムの番号を取得したいのですが、どのようにしたらよろしいのでしょうか? <select name="wordlist"> <option selected>訳語検索の結果</option> for ($i=1; $i<$#midashi; $i++) {print "<option value=\"$midashi[$i]\">$midashi[$i]"; } </select> どなたかアドバイスをどうかよろしくお願いいたします。

    • ベストアンサー
    • Perl
  • [JavaScript+<select>]最初から５文字一致でセレクト状態にしたい。

    こんばんは。 ＨＴＭＬとＪａｖａＳｃｒｉｐｔで簡単な動的ページを作成しています。 そこで、行き詰っていることがありますのでご相談を・・・。 こういう<SELECT>があるとします・・・。 <FORM name="myform"> <SELECT name="menu"> <OPTION value="item1001">メニュー１</OPTION> <OPTION value="item2001">メニュー２</OPTION> </SELECT> </FORM> 初期値を「メニュー２」にしたい場合・・・これをJavaScriptで指定する場合、ONLOADのタイミングで・・・ document.myform.menu.value = "item2001"; とすればいけます。 今回は・・・"item2"だけの情報でヒットさせたいと思っています。 つまり、optionのvalue値の頭から５桁だけのマッチングでセレクト状態にさせたいのです。 ループという形をとらずにセレクトさせる方法を探しています。 テクニックをご教授下さい・・・。 宜しくお願い致します。

  • ラジオボタンとセレクトボックスの選択チェック

    ラジオボタン、セレクトボタンの選択チェックをしたいのですが 同時にチェックする場合どうすればよいのでしょうか。 失敗策ですが、参考までに↓ function check() { var flag=0; if( document.form1.seibetu.length){ flag=1; var i; for(i=0; i<document.form1.seibetu.length; i++){ if(document.form1.seibetu[i].checked){ flag=0; break; } } } else{ if(!document.form1.seibetu.checked){ flag=1; } } if(flag){ window.alert('性別が選択されていません'); return false; } else{ return true; } if(document.form1.nenrei.options[document.form1.nenrei.selectedIndex]. value==""){ flag=1; } if(flag){ window.alert('年齢が選択されていません'); return false; } else{return true; } }

注目のQ&A

カテゴリ

専門家に質問してみよう

職業から探して質問する

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

質問する