HTML5のautocompleteについて
- HTML5のautocompleteでは、初期値の設定は出来ないのでしょうか？
- 例えば、<input type='text' list='hoge' autocomplete='on'><datalist id='hoge'><option value='1'>A<option value='2'>B<option value='3'>C</datalist>とあるとき、select属性の「selected」のように、最初からBが入力された状態にしたいのですが、どのように書けば良いのでしょうか。
- それとも、input属性なのでselectedは使えないのでしょうか。
- ベストアンサー
HTML5のautocompleteについて
こんにちは。 HTML5のautocompleteについて質問があります。 HTML5のautocompleteでは、初期値の設定は出来ないのでしょうか？ 例えば、 <input type="text" list="hoge" autocomplete="on"> <datalist id="hoge"> <option value="1">A <option value="2">B <option value="3">C </datalist> とあるとき、select属性の「selected」のように、最初からBが入力された状態にしたいのですが、どのように書けば良いのでしょうか。 それとも、input属性なのでselectedは使えないのでしょうか。 よろしくお願いいたします。
- amnet2012
- お礼率77% (7/9)
- HTML
- 回答数1
- ありがとう数1
- みんなの回答 （1）
- 専門家の回答
質問者が選んだベストアンサー
出来ません。 autocompleteの目的は、常にユーザーが値を変更したように装うための物ですす。offにすると入力値はブラウザに記憶されませんから、例えば重要なパスワードなどは、 <input type="text" name="pwd" autocomplete="off" size="10">とか・・ 選択済みにする場合は、option要素のselectedを使用します。この場合、意味的にoffとは整合しませんから、autocompleteを書かずdefaultでよいのでは？？ <input type="text" list="hoge"> <datalist id="hoge"> <option value="1">A <option value="2" selected>B <option value="3">C </datalist>
関連するQ&A
- option:selectedで想定の値が取れない
こんにちは。 今、htmlとJavascriptでinput要素の入力欄に入力した値を追加ボタンを押すとdatalistの入力候補に追加され、削除ボタンを押すと入力候補から値を削除するソースを作成しています。 Javascriptの方でテキスト欄に表示されている値を取得したいときはoption:selectedを指定するといいはずですが、リストの何を表示してもリストの一番上の値が削除されてしまいます。 datalistの中にselectを書いているせいなのかとも思いますが、分かりません。 どなたかご教授ください。お願いします。 ざっくりとソースを書くと以下のようになります。 【HTML】 <input type="text" value="" list="alphabet"> <datalist id='alphabet'> <select id='alphabet'> <option value='ABC'></option> <option value='DEF'></option> <option value='GHI'></option> <option value='JKL'></option> </select>
- 締切済み
- JavaScript
- select boxとinput valuの連動
どなたか教えてください。 変な質問の仕方で申し訳ありません。 <select> <option value="hoge1">a1,b1,c1</option> <option value="hoge2">a2,b2,c2</option> <option value="hoge2">a3,b3,c3</option> </select> これはhoge1をセレクトするとa1,b1,c1となりますが、 これをhoge1をセレクトするとinput hoge2、input hoge3、が連動して 値b1,c1を表すような事をしたいのですが。（下記） <select><option value="hoge1">a1</option></select>をセレクトすると <input type="text" name="hoge2" >value値に=b1が入る <input type="text" name="hoge3" > value値に=c1が入る どうすれば動くのか分かりません 初心者なので具体的に教えていただければ幸いです。 何か簡単な方法はないでしょうか？ どうぞよろしくお願い致します。
- ベストアンサー
- HTML
- HTMLをおしえてください。
こちらはPC初心者です。 HTMLここまでつくりました。 名前 <INPUT TYPE="text" NAME="name"><br> ハンドルネーム <INPUT TYPE="text" NAME="name"><br> 好きな色は？ <SELECT NAME="color"> <OPTION SELECTED>選んでください。</OPTION> <OPTION VALUE="red">赤</OPTION> <OPTION VALUE="blue">青</OPTION> <OPTION VALUE="yellow">黄</OPTION> </SELECT><br> 行きたい国は？<br> <INPUT TYPE="checkbox" NAME="usa" VALUE="on">アメリカ<br> <INPUT TYPE="checkbox" NAME="china" VALUE="on">中国<br> <INPUT TYPE="checkbox" NAME="france" VALUE="on">フランス<br> <INPUT TYPE="checkbox" NAME="germany" VALUE="on">ドイツ<br> 感想<br><TEXTAREA NAME="comment" ROWS="4" COLS="30"></TEXTAREA><br> <INPUT TYPE="submit" VALUE="送信"><INPUT TYPE="reset" VALUE="書き直し"> </FORM> </BODY> 送信ボタンをおすとアウトルックが起動するようにしたいです。 書き直しボタンを押すと全部リセットできるようにしたいです。 どうかご指導の方をよろしくおねがいします。
- 締切済み
- その他([技術者向] コンピューター)
- htmlファイルの要素を別ファイルにしたい
ローカルで利用するhtmlファイルを作成しています。 <input type="text" autocomplete="on" list="mylist"> <datalist id="mylist"> <option value="1行目"></option> ・ ・ <option value="200行目"></option> </datalist> datalistのoptionが200行以上あり、 HTMLに直接書いて管理するのがキツイと判断しました。 そこで、別のテキストファイルなどにし HTMLにChildを追加していけば良いのではないかと思ったのですが ローカルのテキストファイルが読めずに困っています。 最初の「require」で引っかかってしまうため上手くいきません。 要素を別ファイルに置いておき、参照できるような いい方法は無いでしょうか。 <script language="javascript"><!-- function TEST() { const fs = require('fs'); const readline = require('readline'); const rs = fs.createReadStream('data/List.txt'); const rl = readline.createInterface({ input: rs }); rl.on('line', (line) => { console.log(line);}); } // --></script> お手数をおかけしますが、回答よろしくお願いいたします。
- ベストアンサー
- JavaScript
- マッチに関する正規表現
$hoge = ’ <select name="a"> <option value="A" selected>■</option> <option value="B">★</option> <option value="C">▲</option> </select> <select name="b"> <option value="A">■</option> <option value="B">★</option> <option value="C" selected>▲</option> </select> ’； となっている場合、 『selected』が付いているoptionにマッチさせ、 そのvalue値【A】や【C】を$hoge1や$hoge2へ代入したいのですが、正規表現はどのようになるのでしょうか？ $hoge =~ /value="?([^"]+)"? selected/g $hoge1 = $1； $hoge2 = $2； ↑これでは、ダメでした。 御教授 お願い致しますm( __ __ )m
- ベストアンサー
- Perl
- firefoxでjavascriptが…
現在、二つのセレクトボックス間でデータのやり取りをするjavascriptを製作しております。ieでは問題なく動作するのですが、firefoxだと セレクトボックスの移動ボタンを押すと余計なものまで消えてしまいます。どなたかご教授ください。 javascript↓ var master_selected_value; var master_selected_text; var user_selected_value; var user_selected_text; function select_master(a){ master_selected_text = a.master_list.options[a.master_list.selectedIndex].text; master_selected_value = a.master_list.options[a.master_list.selectedIndex].value; } function select_user(a){ user_selected_text = a.select_list.options[a.select_list.selectedIndex].text; user_selected_value = a.select_list.options[a.select_list.selectedIndex].value; } function portlet_move(a,b,c){ if( 1 == b ){ var sw = 0; for( n = 0 ; n < a.select_list.length ; n ++ ){ if( a.select_list.options[n].text == master_selected_text){ sw = 1; } } if( sw == 0 && master_selected_text != null ){ a.select_list.options[a.select_list.length] = new Option(master_selected_text,master_selected_value); } }else{ if( null != user_selected_text ){ for( n = a.select_list.selectedIndex ; n < a.select_list.length - 1; n ++ ){ a.select_list.options[n] = a.select_list.options[n + 1]; } a.select_list.length = a.select_list.length - 1; } user_selected_text = null; user_selected_value = null; } } function data_sum(a,b){ var buff = ""; for( n = 0 ; n < a.select_list.length ; n ++ ){ buff = buff + a.select_list.options[n].value; } a.select_list_data.value = buff; a.type.value = b; a.submit(); } function data_send(a,b){ var buff = ""; for( n = 0 ; n < a.select_list.length ; n ++ ){ buff = buff + a.select_list.options[n].value; } a.select_list_data.value = buff; a.type.value = b; a.send.value = "true"; a.submit(); } html↓ <form method="post" action="test.php" onsubmit="return moveItemSelect('ListBox1','ListBox2');"> <input type="hidden" name="type" value=""> <input type="hidden" name="select_list_data" value=""> <input type="hidden" name="send" value=""> <table> <tr> <td> <select name="type" onchange="data_sum(this.form,'recommended');"> <option value="a" selected="selected">a</option> <option value="b">b</option> </select> </td> <td></td> <td></td> </tr> <tr> <td> <select size="10" name="master_list" onchange="select_master(this.form);"> <option value="1">1</option> <option value="2">2</option> </select> </td> <td> <input type="button" class="button" value="→" onclick="portlet_move(this.form,1,2);"> <br /> <input type="button" class="button" value="←" onclick="portlet_move(this.form,2,1);"> </td> <td> <select size="10" name="select_list" onchange="select_user(this.form);"> <option value="1">1</option> </select> </td> </tr> <tr> <td colspan="3"><input type="button" class="button" value="登録" onclick="data_send(this.form,'recommended_write');" /></td> </tr> </table> </form>
- ベストアンサー
- JavaScript
- HTML内の指定の位置にプルダウンを読み込みたい
まずラジオボタンがあって、 選択するとfunctionに格納してあるプルダウンを ラジオボタンの下の指定した箇所に表示させたいです。 ラジオボタンを変更すると、プルダウンも変わるようにしたいです。 教えてください。お願いします。 <HTML><HEAD> <script type="text/javascript"><!-- function pulldown1(){ document.write('<select name="AAA" size="1">'); document.write('<option value="1-1" selected>1-1</option>'); document.write('<option value="1-2">1-2</option>'); document.write('</select>'); } function pulldown2(){ document.write('<select name="BBB" size="1">'); document.write('<option value="2-1" selected>2-1</option>'); document.write('<option value="2-2">2-2</option>'); document.write('</select>'); } //--></script> <style type="text/css"> </HEAD> <BODY><FORM> <INPUT type="radio" name="rdoSample" onClick="pulldown1()">タイプ１ <BR> <INPUT type="radio" name="rdoSample" onClick="pulldown2()">タイプ２ </FORM></BODY> </HTML>
- ベストアンサー
- JavaScript
- プルダウンを選択していないときは、初期値(selected)の値を、選
プルダウンを選択していないときは、初期値(selected)の値を、選択したときは選択値を、hiddenで渡したい。 ▽プルダウン例 <form> <select> <option value="0" selected>A</option> <option value="4">B</option> <option value="6">C</option> </select> </form> ↑上で選択した値(A or B or C)値を、↓下のvalue=「"hoge"」に渡したいです。 ※選択肢は3つだけではなくて、たくさんあります。 ▽input例 <input name="category_name" value="hoge" type="hidden"> ※formとかselectにid振っても構いません。 ※javascriptでやりたいです。
- ベストアンサー
- JavaScript
- HTMLセレクトメニューの選択状態変更
Javascriptで、HTMLの選択状態を変更するにはどうしたらよいか、お分かりになる方がいましたら教えていただければと思います。 下記の例でいくと、AからBにページを更新せずに変更（表示も）したいのです。 <select> <option value="1" selected>A</option> <option value="2">B</option> </select>
- ベストアンサー
- JavaScript
- <input>の選択肢をプルダウンメニューから受け取り、hiddenで
<input>の選択肢をプルダウンメニューから受け取り、hiddenで渡したいのですが、どうすればよいでしょうか？ ▽プルダウン例 <FORM> <SELECT> <OPTION SELECTED>SELECT</OPTION> <OPTION VALUE="1">A</OPTION> <OPTION VALUE="2">B</OPTION> <OPTION VALUE="3">C</OPTION> </SELECT> </FORM> ↑上で選択した値(A or B or C)値を、↓下のvalue=「"hoge"」に渡したいです。 ※選択肢は3つだけではなくて、たくさんあります。 ▽input例 <input name="hosted_button_id" value="hoge" type="hidden"> http://okwave.jp/qa/q6016233.htmlの質問内容が知りたいことに近かったのですが、value値ではなくて、選択した内容そのものをhiddenへ渡す方法を教えてください。
- ベストアンサー
- JavaScript
お礼
ありがとうございます。デフォルトでは出来ないんですね。。。 JavaScriptで無理やりやってみます。