Javascript 如何在输入后查找textarea值

如何在输入后获取textarea的值，但与jQuery不在同一个div中？我尝试了

foreach

和

find

方法。我需要得到值并分配给JS对象

<div id="txtall">
<div class="subdiv">
    <input type = "text" value = "firstInput" class= "subinput">
</div>
<textarea class="textarea"  class="subTextarea"> firsttextareavalue </textarea>

<div class="subdiv">
    <input type = "text" value = "secondInput" class= "subinput">
</div>
<textarea class="textarea" class="subTextarea" /></textarea>

<div class="subdiv">
    <input type = "text" value = "thirdInput" class= "subinput">
</div>
<textarea class="textarea"  class="subTextarea" />second may be empty</textarea>

<div class="subdiv">
    <input type = "text" value = "forthInput" class= "subinput">
</div>
<textarea class="textarea"  class="subTextarea" />last text area value</textarea>

function newObject(input,textarea)
{
 this.input = input;
 this.textarea = textarea;
}
var list = [];
$('#txtall').find('.subinput').each(function() {
  var obj_1 = new newObject();
  obj_1.input = this.value;
   obj_1.textarea = $(".subtextarea",this).val();
  list.push(obj_1);
});

输出需要是：

• 第一输入
• firsttextareavalue
• 二次输入
• （这应该是空的）
• 第三名
• 第二个可能是空的
• 福廷普特
• 最后文本区域值

我还必须给JS对象赋值

<div id="txtall">
<div class="subdiv">
    <input type = "text" value = "firstInput" class= "subinput">
</div>
<textarea class="textarea"  class="subTextarea"> firsttextareavalue </textarea>

<div class="subdiv">
    <input type = "text" value = "secondInput" class= "subinput">
</div>
<textarea class="textarea" class="subTextarea" /></textarea>

<div class="subdiv">
    <input type = "text" value = "thirdInput" class= "subinput">
</div>
<textarea class="textarea"  class="subTextarea" />second may be empty</textarea>

<div class="subdiv">
    <input type = "text" value = "forthInput" class= "subinput">
</div>
<textarea class="textarea"  class="subTextarea" />last text area value</textarea>

function newObject(input,textarea)
{
 this.input = input;
 this.textarea = textarea;
}
var list = [];
$('#txtall').find('.subinput').each(function() {
  var obj_1 = new newObject();
  obj_1.input = this.value;
   obj_1.textarea = $(".subtextarea",this).val();
  list.push(obj_1);
});

顺便说一下，我需要使用

this

，并且我不能为每个输入或文本区域分配不同的id或类。

文本区域位于输入之后，因此它是父

subdiv

中的

下一个（）

元素

$('#txtall').find('.subinput').each(function() {
    console.log( this.value );
    console.log( $(this).closest('.subdiv').next('.subtextarea').val() );
});

当您执行

$（“.subtextarea”，this）

时，它与

$（this）.find（“.subtextarea”）

相同，后者将只查找子体，而输入没有子体

请注意，您的HTML是无效的，您只能有一次class属性，并且不应该两次关闭文本区域

这里也没有理由创建实例，您只需映射元素即可

var list=$（'#txtall'）.find（'.subinput'）.map（函数（）{
返回{
输入：this.value，
textarea:$（this）.closest（'.subdiv'）.next（'.subTextarea'）.val（）
}
}).get（）；
console.log（列表）

firsttextareavalue
第二个可能是空的
最后文本区域值

尝试此代码使用$（this.parent（）.next（）.val（）它将获得输入父项旁边的文本区域

function newObject(input,textarea)
{
 this.input = input;
 this.textarea = textarea;
}
var list = [];
$('#txtall').find('.subinput').each(function() {

  var obj_1 = new newObject();
  obj_1.input = this.value;
   obj_1.textarea = $(this).parent().next().val();
  list.push(obj_1);
});

使用

.next（）

进入父DIV之后的下一个元素

函数newObject（输入，文本区域）{
这个输入=输入；
this.textarea=textarea；
}
$（“#按钮”）。单击（函数（）{
var列表=[]；
$（'#txtall'）.find（'.subinput'）.each（function（）{
var输入=此值；
var textarea=$（this.nexist（.subdiv”）.next（.subTextarea”）.val（）；
var obj_1=新对象（输入，文本区域）；
列表推送（obj_1）；
});
控制台日志（列表）；
});

firsttextareavalue
第二个可能是空的
最后文本区域值
单击我
。感谢您的解释和映射功能。这似乎是更有效的方法。我不能在另一个例子中使用class属性吗？在你发布的代码中没有任何东西表明你需要原型或使用实例。您只需将值推送到一个数组，或将它们映射到上面这样的数组，而无需每次都创建新实例。实际上，我需要发布mycontroller（mvc#project），我的方法是“public void save（int id，ListmyList）”，这就是我使用实例的原因。我可以像newObject实例那样映射吗？是的，您不需要实例来存储您要发布的数据