![](http://oshiete.xgoo.jp/images/v2/pc/qa/question_title.png?e8efa67)
行いたいこと
tableタグにあるTHREDタグとTBODYタグがあり、現在はTBODYタグの任意行を選択するとその行の色が変わるようになっています。
サーバアクションで画面遷移を行ったりした後、その画面に戻ってくる時に以前選択されていた行が存在したらそこで色が変わるようにしています。
そこで問題なのですが、その画面に戻ってきた時にしたのほうが選択行だった場合フォーカスが当たり、すくロースして表示してないと一瞬どこいった?という風に感じてしまいます。なので、そこの行まで飛ばしてやりたいのですが、できるでしょうか?
選択行の色変えには以下の関数を作って行っています。
function syncroData(){
for(var i = 1 ; i < table10.rows.length ; i++){
if(i == hojirowid){
table10.rows[i].style.backgroundColor = "yellow";
} else{
if(i%2 == 0){
table10.rows[i].style.background = "#fff8dc";
}else{
table10.rows[i].style.background = "#f5fffa";
}
}
}
試しにfor文が終わった後に
table10.rows[i].focus();
と記述してみましたが、そういうメソッドが使えないのかそこまで飛んでくれませんでした(もしかしたら、フォーカスだけあたってスクロールしなかっただけ?)
以上、宜しくお願い致します。
No.3ベストアンサー
- 回答日時:
スクロールさせたい位置を調べて、scrollTo すればよいのでは?
var node = table10.rows[i];
var y = 0;
while (node.tagName.toUpperCase() != "BODY") {
y += node.offsetTop;
node = node.parentNode;
}
window.scrollTo(0, y);
※インデントは全角空白なので、コピーする場合はタブなどに変えてください。
レスが遅れました・・・・・納期ぎりぎりでやってたもんで・・・・
scrollToメソッドについては知りませんでした・・
今回はできないということで、相手側に伝えてしまったので、次回以降に役立てたいと思います。
ありがとうございました。
No.2
- 回答日時:
私の解釈が間違っているかも・・・
表の任意行までスクロールさせたいのなら表の各行に
こんな↓感じで<a name=..">を入れておいて
<table>
<tr><td><a name="001">A</a></td><td>B</td><td>c</td></tr>
<tr><td><a name="002">A</a></td><td>B</td><td>c</td></tr>
</table>
戻るときに
document.location.href="hoge.html#002"
とか
<a href="hoge.html#002">もどる</a>
とやれば、その行のあたりが表示されますので、
「#002」の部分を動的に変更してやれば良さそうですが。。。。
レスが遅れました・・・・・納期ぎりぎりでやってたもんで・・・・
今回のテーブルの中身はxmlでのBindDataで処理を行っているため、単純にaタグを入れ込めそうにありませんでした。
今後の参考にしたいと思います。ありがとうございました。
No.1
- 回答日時:
僕の知っている範囲では、できないと思いますが。
。。ちょっと誤解がある様なので、
> 試しにfor文が終わった後に
> table10.rows[i].focus();
> と記述してみましたが、そういうメソッドが使えないのかそこまで飛んでくれませんでした(もしかしたら、フォーカスだけあたってスクロールしなかっただけ?)
どうやら、フォーカスの意味を取り違えているようです。
フォーカスと言うのは、そのフォームの中の指定された名前を、処理の対象としますよ。と言う意味であって、そこへ移動しますよ。と言う意味ではありません。
なので、
> (もしかしたら、フォーカスだけあたってスクロールしなかっただけ?)
その通りです。
Webの場合、見ている人のブラウザ環境が同じであるとは限らないので、そう言う処理はサポートされていない。と言うパターンが多いのですよね。
レスが遅れました・・・・・納期ぎりぎりでやってたもんで・・・・
textareaなどは、focusを当てるとそこに飛ぶのでスクロールするのですが、この場合はあくまでテーブルにフォーカスが当たっているようで、スクロールはしないようですね^^;
回答ありがとうございました
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- JavaScript javascriptでテーブルに追加した項目のid追加してローカルストレージを操作したい 5 2023/01/01 15:52
- Excel(エクセル) VBA : スクレイピングできない 4 2023/05/12 22:26
- PHP if(preg_match("/[^0-9]/",$gu_d)){意味を教えてください。 1 2022/05/06 05:37
- HTML・CSS 自身のHPにYouTube動画を貼り付けるのが出来なくなり困ってます 1 2022/11/11 10:44
- Visual Basic(VBA) Selenium.ChromeDriverの使い方について 7 2022/09/22 06:43
- JavaScript 画像の表示位置 3 2022/12/23 08:25
- HTML・CSS テーブルタグのセルの幅の一部だけを指定 1 2023/03/12 12:02
- JavaScript ①入力フォーム→②確認表示画面→③送信完了画面のコードを書いているのです、 入力フォームから受け取っ 2 2022/05/10 16:45
- HTML・CSS (Javascript)印刷するファイルに応じて印刷プレビュー画面で用紙を自動的に切り替えたい!! 2 2022/04/11 12:04
- その他(プログラミング・Web制作) pythonリストの特定の値を表示htmlで表示できない 2 2022/05/14 05:48
このQ&Aを見た人はこんなQ&Aも見ています
-
「環境が人を育てる」って本当?環境によって人格や生き方は本当に変わるのか
環境が人生に与える影響は実際どれほどのものなのか、専門家の田宮由美さんに伺った。
-
チェックボックス付きのテーブルから、チェックの付いた行のみの値を取得したい
JavaScript
-
一覧から選択した行の行番号を取得について
JavaScript
-
htmlでテーブル内にテキストボックスを作りたいのですが・・・
HTML・CSS
-
-
4
テーブルの任意の列を非表示にしたい
HTML・CSS
-
5
クリックされたセルの位置を取得するには?
JavaScript
-
6
tableタグとformタグの組み合わせ
HTML・CSS
-
7
ORA-01013のエラーについて経験のある方お願いします。
Oracle
-
8
テーブルタグの中にdivを含めてはダメ?
HTML・CSS
-
9
登録済みイベントリスナーの情報を取得したい
JavaScript
-
10
文字の横にプルダウンを表示させたいのですが、どうすればいいでしょうか?
HTML・CSS
-
11
vb.netで画面のコントロールId名を変数で動的に制御し処理する方法
Visual Basic(VBA)
-
12
switch()文で値の大小比較
PHP
-
13
focus()が上手くいかない
JavaScript
-
14
画面表示とともに、テーブルの横スクロール位置を指定したい
JavaScript
-
15
javascriptで作成されたテーブルの値を取得したい
JavaScript
-
16
テーブルとテーブルの間隔について
HTML・CSS
-
17
画面表示とともにtableの指定の行位置を表示
JavaScript
-
18
上下キーを押すと、ページスクロールしてしまうのです
JavaScript
-
19
DateTimePickerでに年月までしか選択できないようにしたいです。
Visual Basic(VBA)
-
20
jquery datatablesを使用 インプットタグに数値入力して行の合計金額を出したい
JavaScript
関連するカテゴリからQ&Aを探す
おすすめ情報
このQ&Aを見た人がよく見るQ&A
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
プルダウンで選択すると、DBの...
-
jqueryとscriptでTABLEのセルを...
-
VB.NET
-
特定<table>内の<td>の色を変える
-
ブルダウン選択でページの表示...
-
テーブルの項目の値取得
-
ラジオボタンとセルの連動
-
特定タグの文字を抽出するには
-
JavaScriptで特定のtdタグにcla...
-
一覧から選択した行の行番号を...
-
firefoxでchildNodesの代用
-
javascriptを短く方法ありますか?
-
return trueとreturn falseの用...
-
プルダウン選択を変更すると、...
-
slickのレスポンシブ > center...
-
FormのonsubmitでJavaスクリプ...
-
onchangeイベントを強制的に発...
-
submitがおされた同時に JavaSc...
-
select要素のvalueを配列で取得...
-
Selectボックスの幅を自動で広...
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
ハイパーリンクを別ウインドウ...
-
プルダウンで選択すると、DBの...
-
一覧から選択した行の行番号を...
-
tableの任意行にfocusをあてる
-
特定<table>内の<td>の色を変える
-
JavaScriptで特定のtdタグにcla...
-
至急!GetElementById でtdの...
-
マウスをブラウザの外に出した...
-
【UWSC】HTML内のある部分を抽...
-
スクロールバーの表示位置を変...
-
クリックされた罫表セルの行番...
-
テーブルの変数について
-
動的なtableの値を取得したい
-
特定の文字列を挿入
-
テーブル内に表示されている数...
-
javascript クリックすると、あ...
-
テーブルの項目の値取得
-
javascriptで質問です。 displa...
-
Tablesorteを2行一組でソートする
-
\\u30ad\\u30fc\\u30dc・・・と...
おすすめ情報