如何从具有相同ID的许多不同textarea获取textarea值

Question

如何使用jQuery从具有相同ID的许多不同textarea标记中获取值？我还需要允许用户选择他/她想要添加评论的textarea，然后获得评论。

这是我的HTML

<div class="container">
    <div class="wall_post">
        <p>First Post</p>
        <textarea id="user_comment" class="form-control" placeholder="Type your comment here"></textarea>
    </div>
        <div class="wall_post">
            <p>Second Post</p>
        <textarea id="user_comment" class="form-control" placeholder="Type your comment here"></textarea>
    </div>
        <div class="wall_post">
            <p>Third Post</p>
        <textarea id="user_comment" class="form-control" placeholder="Type your comment here"></textarea>
    </div>
        <div class="wall_post">
            <p>Fourth Post</p>
        <textarea id="user_comment" class="form-control" placeholder="Type your comment here" ></textarea>
    </div>
</div>

到目前为止这是我的jQuery

此jQuery仅打印出第一个textarea值，但忽略其他值。

$(document).on('keydown', function(e) {
    var targetInput = $('#user_comment');

    if(!targetInput.is(document.activeElement)) {
        alert('Typed while not focused on #myInput!');
    }else{
        if(e.which == 13){
        alert(targetInput.val());
         targetInput.val('');

        }
  }
}); 

提前谢谢！

Answer 1

Ids必须是唯一的。你可以使用classname。

此外，您可以使用target获取当前的keydown元素：

$(document).on('keydown', function(e) {
 var targetInput = $(e.target);
   if(!targetInput.is('textarea')) {
      alert('Typed while not focused on #myInput!');
   }else{
     if(e.which == 13){
       alert(targetInput.val());
       targetInput.val('');
    }
}}); 

<强> Working Demo

Answer 2

由于ID预计是唯一的，因此jQuery将返回第一个元素，而不是具有该ID的所有元素的列表。

要访问所有textareas，您可以使用此选择器（假设每个wall_post div只有一个文本区域：

$('.wall_post textarea')

您也可以将keydown事件绑定到此：

$(document).on('keydown', '.wall_post textarea', function(e) {
    // do whatever you need to with this textarea
});