某スレッド掲示板機能で返信を押すとコメント欄本文にアンカーを自動で付け加えたい。

> レス7番の返信を押すと、コメント記入部分に「>>7」と自動的に付ける
> 返信を押した瞬間にビューンってコメント記入欄まで自動スクロールしたい

このいずれも可能ですが、問題がいくつかあります。
スレッド掲示板では、返信ボタンが無いと思うので、それを入れる必要があると言うのがひとつ。
スレッド掲示板の名前の前にある数字は、本来の通し番号ではなくcssで擬似的に表示されている数字だと言うことがひとつです。

またアンカーにリンクをつけてマウスオーバーしたらその中身が表示されると言うのも可能ですが、コメントのページャーで違うページに行っているものは拾えないだろうと思います。

11 名前 
何かしらテキスト
>> 3

このようにあって、このコメントがページをまたがって表示されている時、例えば10件表示で最初の10件が1ページ目にあって、11件が2ページめであった場合などです。
で、おそらくデフォルトのスレット掲示板では、この11は1と表示されるのではなかろうかと思います。

質問のような機能を搭載しようとした場合、連番がコメントに対して対でふってある必要があるのと、マウスオーバーした時にそのコメントを拾うためには、同じ画面にそのデータがある必要があります。もしくは、リンクからデータを拾ってくる別の処理が必要(ajaxでデータにアクセスとかその他諸々)が必要です。

サンプル: 質問の内容を擬似的に再現 | codepen

スレッド掲示板の返信ボタンは /css/thread.cssで非表示になっていますので、サンプルそれを使わず新たに、返信と言う要素をひとまず追加してあります。

/lib/comment.php

<span class="comment-edit">
  <?php edit_comment_link('編集','  ',''); //編集リンク ?>
</span>
//上記の後に
<span class="comment-ry">
  <span data-reid="<?php comment_ID(); ?>">返信</span>
</span>

サンプルでは、これを追加した状態で出力されたhtmlを元に、jQueryで効果を実装してあります。

返信をクリックすれば、テキストエリアにコメントIDが入り、テキストエリアまでスクロールします。この動作は特に問題ありませんが、返信ボタンを押したコメントの番号と、テキストエリアに表示される数値が違うのに気が付かれるでしょう。

コメントidがwordpressではどのように管理しているのかは知りませんが、コメントごとにidが振られています。各コメントの名前の前の数字がこのidであればサンプルのテキストエリアに挿入する数値は一致します。しかしコメントの一番最初が1じゃないとなんだか並び的におかしいですよね。

これらいくつかの問題があるため、完全に某掲示板のようなコメントを作るのはサックリとはできません。
最低限必要とされる基本的なhtmlの出力があれば後の効果はjQueryで可能です。

某掲示板のようなコメントプラグインは知りませんけれども、おそらく誰かが作っているんじゃないかなぁとは思うんですけどね。

bbpressとかは、フォーラムでコメントとはまた違いますが、結構近い機能があるようにも思いますし、昔テストでフォーラムがもう少し使いやすくならないだろうかとテストがてら作ったサンプルが結構動作的に近いのではなかろうかと。
まぁこのサンプルが正しく動作するかはわかりませんけどね。あくまでテスト用ですので。

わいひらさん、hidekichiさんご返事ありがとう御座います。
hidekichiに作って頂いたサンプル動作は、まさに理想の形でした！

自分の図ブログ環境では
・階層までのスレッド (入れ子) 形式にしない。
・コメントを複数ページに分割しない。
・基本的にコメントを削除しない。（順番が変わることはない。）

という環境にしているのですが、返信ボタンを押したコメントの番号と、
テキストエリアに表示される数値を一緒にするのは難しいでしょうか？

olで表示されている数字と同じように、上から数えてナンバリングすればいいのかなと思ったのですが、
知識が乏しいため実装することができません・・。

よろしく願いします。

階層までのスレッド (入れ子) 形式にしない。
コメントを複数ページに分割しない。
基本的にコメントを削除しない。（順番が変わることはない。）

> 返信ボタンを押したコメントの番号と、
> テキストエリアに表示される数値を一緒にするのは難しいでしょうか？

入れ子にしないと言うのと、コメントを複数ページに分割しないと言うのが条件ならできるかもしれません。
と言うことで、新たにサンプルを作りました。以前のサンプルとは違うアドレスです。

サンプル: 3桁の通し番号と、それに合わせた返信番号 + 前回のスクリプト(fork) | codepen

サンプルでは返信レス分が入ってますが、無いものとしてみてください。
クリックしたボタンのliのインデックス(+1)を拾って値にしています。また同様にして名前の前に3桁の数値を入れています。意味はありませんが行揃えのため。
4桁が必要な場合は、javascript欄冒頭のzeroPaddingの中の3を全て4に変えてください。wordpressのコメントで999超えるようなら、迷わずbbPressや他のフォーラムプラグインを利用する方が良いです。無いとは思うんですけどね一応。

1つ目 001 テキストエリア >>1
2つ目 002 テキストエリア >>2

ちなみに、phpで入れている分はjQueryでやりましたので、jQueryだけで動作します。

おまけで、元のレスにスクロールで戻るボタンを入れました（笑）
このボタンをクリックすると自動でこのボタン自体が消えます。返信を押すと新たにセットされたボタンが表示されます。

何かしら入力中に、このボタンを押して元のレスに戻り、返信ボタンを押すとテキストエリアがクリアされます。

まぁいらない機能なので不要なら消しますので言ってください（笑）

hidekichiさん有難うございます。

順番通りコメントの番号に対してアンカーを付け加えることができました！
せっかく、追加してくださって申し訳ないのですが、おまけ機能を消すにはどの部分を消去したらよいでしょうか。

あ、やっぱりいりませんでした？（笑）

まぁ僕もいらないかなとは思ってたんですけどね。ただまぁ、元のコメントを参考にしたい場合もあるかなと思いまして入れた次第です。

ということで、機能を削除したものでアップデートしましたので、javascriptはこのサンプルと入れ替えてください。cssも一部不要になりましたので該当部分をコメントアウトしています。

hidekichiさん有難うございます。

やりたいことが全て叶いました。感謝感激です。
こんな早く叶うとは思ってもいなかったです。

親身に付きあってくださりありがとうございました。
この度はありがとうございました。