Проблема JQuery со списками - PullRequest
Новая
       3

Проблема JQuery со списками

0 голосов
/ 12 февраля 2011

Хорошо, вот мой код: 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
        <title>test</title>
        <style type="text/css">
            .invirep{
                display:none;
            }
        </style>
        <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js"></script>
        <script type="text/javascript">
            $(function(){
                var replylinkcode = $('<a href="#" id="reply"> [Reply]</a>');
                $('#comments ul li').append(replylinkcode);
                $('#reply').click(function(){
                    var textareacode = $("<br/><textarea cols='10' rows='2' id='replybox'></textarea>");
                    $(this).parent().append(textareacode);
                });
            });
        </script>
    </head>
    <body>
        <div id="comments">
            <ul>
                <li>Comment 1</li>
                <li>Comment 2</li>
                <li>Comment 3</li>
                <li>Comment 4</li>
            </ul>
        </div>
    </body>
</html>

Моя проблема: почему текстовое поле появляется только когда я нажимаю на ссылку ответа первого элемента, а не для других элементов (второго, третьего и четвертого элементов)?

Ответы [ 3 ]

0 голосов
/ 12 февраля 2011

Во-первых, вы используете очень старую версию jQuery - текущая версия на три основные версии впереди.Пожалуйста, обновите, на самом деле не так много причин, чтобы этого не делать.

Во-вторых, вы создаете несколько элементов с одинаковым id - это недопустимый HTML и, вероятно, причина того, почему код не работает.

Используя новый синтаксис, введенный в jQuery 1.4, вы можете переписать код следующим образом: 

$('<a>', {
    text: '[reply]', 
    href: '#', 
    click: function(){
        $("<br/><textarea cols='10' rows='2' id='replybox'></textarea>").appendTo(this.parentNode);
    }
}).appendTo('#comments li');
0 голосов
/ 12 февраля 2011

Поскольку вы используете ID вместо класса.

http://jsfiddle.net/a55Tb/

0 голосов
/ 12 февраля 2011

Похоже, вы добавляете селектор jQuery к элементу. 

var replylinkcode = $('<a href="#" id="reply"> [Reply]</a>');

должно быть: 

var replylinkcode = '<a href="#" id="reply"> Reply</a>';
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...