1

私はブログに取り組んでおり、エントリにコメントを残すことができるように設定しています。すべてのコメントとエントリー フォームが使用する縦方向のスペースが気に入らないので、各エントリーをクリックすると、エントリー フォームとコメントが表示されるリンクを付けたいと思います。「コメント(5)」のようなリンクを考えています。これは他のサイトでよく見かけますが、自分で作成する方法がわかりません。

これは、エントリの 1 つの HTML の一部です。

<div class="comments">
<form action="foxpost.php" method="post">

<label for="name">Name</label><br>
<input id="name" name="name" type="text" /><br>
<label for="message">Comment</label><br>
<textarea class="message" id="message" name="message"></textarea><br><br>
<input type="hidden" name="post_id" value="7" />

<input type="Submit" value="Post Comment" />
</form>
<?php
displayComments(7);
?>      

</div>

displayComments(); 関数は、データベースからコメントを取得する単なる PHP です。

私が考えることができる唯一のことは、to を変更し、各コメント領域に別の ID (「comments2」、「comments3」など) を使用してから、document.getElementByID().style を含む JavaScript 関数を使用することです。 「commentsX」divごとに異なるCSSエントリを変更するために表示します。しかし、それは肥大化しているように見えるので、コメントを取得するフォームとphp関数を動的に表示および非表示にする簡単な方法があるかどうか疑問に思っています。

4

2 に答える 2

2

あなたがより簡単な方法を求めたので、私は jQuery に行きます。それらに異なる ID を割り当てる必要はありません。クラスを使用するだけで、jQuery は次のように対応する要素を自動的に表示します。

$('a.comment').click(function(){
  $(this).nextAll('.form').slideDown('slow');
});

whereはクラスとa.commentのリンクを表し、コメントを含む要素のクラスを表します。comment.form

于 2010-08-07T21:35:33.667 に答える
0

コメント div 全体を非表示にしても問題ない場合は、ID を指定できます。

<div class=comments id=comments>

プレーンな JavaScript で表示します。

document.getElementById("comments").style.display = "block"
于 2010-08-07T21:43:27.393 に答える