jQuery:元素孩子的精选孩子

Question

html：

<form id=f1>
  <div>
    <input id=text>
  </div>
</form>
<form id=f2>
  <div>
    <input id=text>
  </div>
</form>

jQuery：

$('form').submit(function(){
  var id=$(this).attr('id');
  var text=$('#'+id+'#text').val();
  alert(text);
});

结果：

未定义

我需要选择输入，但我不知道如何，

纠正了这个问题

Answer 1

您需要选择器部分之间的空间：

var text = $("#" + id + " #text").val();

，但根本不需要使用ID：

var text = $(this).find("#text").val();

另外，ID应该是唯一的，您不能多次拥有id="text"。您应该使用class="text"，然后是：

var text = $(this).find(".text").val();

$('form').submit(function(){
  var text=$(this).find(".text").val();
  console.log(text);
  return false;
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form id=f1>
  <div>
    <input class=text>
  </div>
</form>
<form id=f2>
  <div>
    <input class=text>
  </div>
</form>

Answer 2

首先，您不应该使用多个ID！id应该是唯一的。

在您的示例中，您将错误的选择器传递给jQuery函数，应该是： var text = $('#' + id + ' #text');(选择器之间缺少空间(