Javascript 查找输入元素

似乎JQuery在使用时有一些神奇的/细微的差别。为输入元素或一些复杂的后代（或者我是盲人）找到方法。 这是我的JS代码：

<div id="edit_lists_div">
  <div style="width: 100%; margin-bottom:5px">&nbsp;
  <button value="" style="display: none;" id="edit_lists_div_btn1">Btn1</button>
  <button value="" style="display: none;" id="edit_lists_div_btn2"
  disabled="disabled">Btn2</button>
  <button value="" style="display: none;" id="edit_lists_div_btn3"
  disabled="disabled">Btn3</button>
  </div>
  <div style="width: 100%; height: 210px; overflow: auto;">
  <table class="my_grid" id="edit_lists_div_table">
      <thead>
      <tr>
          <th width="30"></th>
          <th style="display: none;">id</th>
          <th width="100">Title</th>
          <th width="25">Some field 1</th>
          <th style="display: none;">some_property</th>
          <th>Some field 2</th>
      </tr>
      </thead>
      <caption>Lists</caption>
      <tbody>
      <tr>
          <td property_name="">
          <input row_selector="true" type="checkbox">
          </td>
          <td style="display: none;" property_value="157" property_name="id">157</td>
          <td property_value="List1" property_name="title">List1</td>
          <td property_value="4" property_name="subscribers_count">4</td>
          <td style="display: none;" property_value="9867,9869,9871,9868"
          property_name="subscribers">9867,9869,9871,9868</td>
          <td property_value="New" property_name="status">New</td>
      </tr>
      </tbody>
  </table>
  </div>

这里有什么问题

更新1:注意，此处仍然找不到解决方案。我选择了已经正确的答案，但没有选择，因为它在我的应用程序环境中变得不可行。我的意思是这样的回答：

var tmp = $("#edit_lists_div").find("tbody");    
var div_inputs = $('input[type="checkbox"]', '#edit_lists_div');

仅在第一次Firebug调试中是可行的。然后我又找到了空/未找到JQuery对象

同样的情况也适用于此代码：

var tmp = $("#edit_lists_div").find("tbody");    
var div_inputs = $('input', '#edit_lists_div');

这是它第一次起作用。但在第二次尝试后被打破了。这里真是个神秘主义者

更新2:关于我的处理程序可能出现的问题。。。不是！我已检查此案例的代码：

$.ajax({
url : getUrl(),
dataType : "json",
success : function(data) {
   // my code goes here and still can't get input element!
  }
});

更新3:如果有什么问题，我需要这些输入：

div_inputs.each(function() {
// some business logic with found inputs goes here
});

---

我会在表格中搜索一个复选框，因为表格有一个ID，应该很容易找到，而且只有一个复选框：

$(function() {
    $('input[type="checkbox"]', '#edit_lists_div_table').prop('checked',true);
});

---

我建议您不要使用

.find（）

，而是使用链式选择器：

 var $checkbox = $('#edit_lists_div tbody input');

---

我不确定你有什么问题。您发布的代码在jsfiddler.net上运行良好：

//包括格式化代码是stackoverflow对我的JSFIDLE链接很满意

var tmp = $("#edit_lists_div").find("tbody");
var div_inputs = tmp.find("input"); // it is empty!
alert(div_inputs.attr("type"));

---

好的，解决方案找到了。它不在JQuery中。它在我的应用程序架构中。我在JS代码之前调用了async$.ajax。在success函数中，它创建了我的表，但正如您所了解的，在success方法处理之前，我尝试访问此表元素，所以在创建它们之前

---

希望它能帮助一些人。当心AJAX

您的代码应该可以工作，把它放在文档就绪处理程序中。它适合我。如果您对console.log进行注释，结果将是相同的：）这没有意义，如果console.log输出结果，这意味着它可以工作。您还可以直接使用

$（“输入[row\u选择器]”）

或$（“输入[row\u过滤器='true']”）作为目标，就像其他人建议的那样，确保将其包装在文档就绪处理程序中。是否将其包装在DOM就绪函数中，以及是否确保tbody元素在浏览器中正确输出等？1）可以有多个复选框。你的解决方案仍然正确吗？2） 我真的不知道DOM就绪的乐趣-这段代码是在用户单击某个UI元素后调用的。是这样吗？如果在同一个表中可以有多个复选框，您需要一些东西来区分它们。ID是最好的，但最坏的情况是，您可以使用

first（）

、

last（）

、

eq（）

等通过索引进行选择。如果单击功能有效，复选框的选择器（如果存在）也应该有效。此解决方案对我有效！那么我的代码有什么问题呢？打开控制台，在elements视图中检查输出的HTML。有时浏览器会在奇怪的地方输出tbody元素，如果它不知何故丢失了等等，我通常不使用tbody作为选择器，因为经验表明，可能会有比你想象的更多的元素。这是我唯一能想到的。@MichaelZ对不起，我没有按叉钮。下面是这个解决方案中的实际代码：那么，这段代码没有做您希望它做的事情是什么？它肯定是在生成一个包含复选框的jQuery对象；请解释为什么这还不够，我们将更好地理解如何帮助您。@apsillers此代码与commented和uncommented console.log有相同的结果，所以不要证明任何东西@MichaelZ当您注释掉这行代码时，JavaScript控制台肯定是不同的。当您调用

console.log

时，我不是您期望的其他不同之处。如果您不知道如何在浏览器中访问JS控制台，请尝试使用

alert

而不是

console.log

。@chamila\u c-如果

.find（）

不知道，为什么会这样做？要么两者都能工作，要么两者都不能。@apsillers OK，警报版本就是证明！但是为什么它在我的代码上下文中不起作用呢？嗯。。确实，你的链接有可行的代码。但为什么我的应用程序中的代码没有

 var $checkbox = $('#edit_lists_div tbody input');

var tmp = $("#edit_lists_div").find("tbody");
var div_inputs = tmp.find("input"); // it is empty!
alert(div_inputs.attr("type"));