0

コメントの配列があり、コメントに答えることができるはずです。

<div>
<a href="#" class="answerBtn" id="<?=$comment->id ?>">Answer</a>
    <div id="answerDiv" style="display:none;">
        <form action="" method="POST">
            <input type="hidden" value="<?=$comment->id ?>"/>
                <p>
                     <label>Your name*</label>
                <br />
                     <input type="text" name="answer_username" id="answer_username" required />
                </p>
                <p>
                    <label>Your Email (optional)</label>
                <br />
                        <input type="text" name="answer_email" />  
                </p>
                <p>
                    <label>Your comment*</label>
                <br />
                <textarea name="answer_message" required></textarea>
                </p>
                <input type="hidden" value="<?=base_url()?>" id="answer_baseurl"/>
                <input type="submit" value="Send"/>                             
                </form>
                </div>

リンクをクリックしたときにフォームを表示したいのですが、各コメントは同じフォームなので具体的にしなければならないので、コメントのidに応じてフォームを表示したいです。だから私はjqueryでこのようなことを試しました:

$('.answerBtn').click(function(){
    var id = $(this).attr('id');
    $('id + div').slideToggle();
});

しかし、それは実際には機能しません...

誰かが私を助けることができますか？

4

4 に答える 4

1

div表示されるのは次の兄弟らしいので.next()要素を探すのに使う

$('.answerBtn').click(function(){
    $(this).next().slideToggle();
});
于 2013-10-03T09:59:59.707 に答える
0

次の行は、タグ idのみを考慮します:

$('id + div').slideToggle();

変数はまったく使用しませんid。

代わりに、次を使用します。

$('#' + id + ' + div').slideToggle();
于 2013-10-03T09:58:12.320 に答える
0

より良い方法は、フォームを保持する div に同じ id を割り当てることだと思います

<a href="#" class="answerBtn" id="<?=$comment->id ?>">Answer</a>

<div id="answerDiv_<?=$comment->id ?>" style="display:none;"> ... </div>

次に、がクリックdivされたときに対応するものを表示します。.answerBtn

$('.answerBtn').click(function(){
    var id = $(this).attr('id');
    $('div#answerDiv_'+id).slideToggle();
});
于 2013-10-03T10:02:26.753 に答える
0

コメントの id をdivにも追加します。

 <div id="answerDiv<?=$comment->id ?>" style="display:none;">

そしてスクリプトで、試してください

 $('.answerBtn').click(function(){
    var id = $(this).attr('id');
    $('#answerDiv'+id).slideToggle();
 });
于 2013-10-03T10:03:43.430 に答える