Question

我有一个代码，当有新消息时它会在所有消息下生成<form id=replyForm>。现在我希望能够按ENTER键发送数据，现在它适用于第一个form，但它忽略了第二个第三个等等。我做错了什么可以有人帮助我？

<form id=replyForm>
    <textarea id=reply></textarea>
</form>
<form id=replyForm>
    <textarea id=reply></textarea>
</form>

var replyForm = $('#replyForm');
var replyVal = $('#reply');

replyForm.on('keydown', function(evt) {
    var key = (evt.keyCode ? evt.keyCode : evt.which);
    if (key === 13) {
        if (replyVal.val()) {

            $.ajax({
                url: 'reply.php',
                type: "POST",
                data: replyForm.serialize() + '&reply=',
                success: function(data) {
                    console.log(data);
                }
            });
            replyVal.val("");
        }
    }
});

Answer 1

不要使用“id”。通常你在文档中声明一次“id”。使用“class”标签

试试这个：http://jsfiddle.net/a9g1a7o0/2/

var replyForm = $('.replyForm');

replyForm.on('keydown', function(evt) {

    var key = (evt.keyCode ? evt.keyCode : evt.which);

    // get the reply from selected form
    replyField = $(this).find("textarea");
    replyVal = replyField.val();

    if (key === 13) {
        // prevent enter, line down
        evt.preventDefault();

        // test, append reply val to document
        // delete this line
        $('body').append(replyVal + '<br>');

        if (replyVal) {
            // do ajax stuff
            $.ajax({
                url: 'reply.php',
                type: "POST",
                data: replyForm.serialize() + '&reply=',
                success: function(data) {
                    console.log(data);
                }
            });
            // clear field
            replyField.val('');
        }

    }
});

Answer 2

HTML中的

id 在文档中必须是唯一的，两个不同的元素不能具有相同的id。

您必须通过其他方式选择它们，例如使用class属性：

HTML

<form class="replyForm">
    <textarea class="reply"></textarea>
</form>
<form class="replyForm">
    <textarea class="reply"></textarea>
</form>

的Javascript

var replyForm = $('.replyForm');
var replyVal = $('.reply');

Keydown检查2个同名的表格

2 个答案: