Jquery получить идентификатор выбранного элемента и показать скрытый дочерний элемент

Question

Jquery получить идентификатор выбранного элемента и показать скрытый дочерний элемент

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>

Я хочу отобразить форму при нажатии ссылки, но поскольку каждый комментарий имеет ту же форму, я должен быть конкретным, поэтому я хочу показать форму в зависимости от идентификатора комментария. поэтому я попробовал что-то вроде этого с jquery:

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

но это действительно не работает...

Кто-нибудь может мне помочь?

hausinho 03 окт. 2013, в 12:28

Источник

Теги:

php

jquery

4 ответа

Ещё вопросы

Arun P Johny · Answer 1 · 2013-10-03T08-54-00.000Z

Поскольку отображаемый div, кажется, следующий брат, используйте .next() чтобы найти элемент

$('.answerBtn').click(function(){
    $(this).next().slideToggle();
});

это прекрасно работает! большое спасибо!

Gurminder Singh · Answer 2 · 2013-10-03T08-41-00.000Z

Добавьте идентификатор комментария в div также:

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

и в скрипте попробуйте

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

Denis · Answer 3 · 2013-10-03T08-19-00.000Z

Следующая строка касается только тега id:

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

Он вообще не использует id переменной.

Вместо этого используйте следующее:

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

Alex · Answer 4 · 2013-10-03T07-57-00.000Z

Я думаю, что лучший способ состоял бы в том, чтобы определить тот же идентификатор div, который имеет форму

<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();
});