jQuery用类查找下一个元素答案

【问题标题】：jQuery find next element with classjQuery用类查找下一个元素
【发布时间】：2011-07-09 10:03:43
【问题描述】：

我有一个非常简单的问题，吃了我 4 个小时，但还没有解决：如何使用 jQuery 找到具有特定类的下一个跨度？我有以下html

<tr>
    <td align="right">Име:&nbsp;</td>
    <td align="left">
         <input type="text" value="<?=$profileSQL['user_name']; ?>" name="user_name" class="input required" />
    </td>
</tr>
<tr>
    <td align="right" colspan="2">
         <span class="error"></span>
    </td>
</tr>

我用 jQuery 验证它。我想如果有错误消息，用 js（只是一个字符串）生成，jQuery 以找到最接近的 span 类 .error 和 text() 那里的消息。我尝试了nextAll()、next("span.error") 和许多其他东西，但没有任何帮助。

提前致谢！

【问题讨论】：

尝试显示浏览器（查看源代码）看到的实际呈现的 html，而不是我假设 php。
@DavidThomas：这个 php 只是一个字符串，但我尝试了你的方法，结果是一样的 @jAndy：我认为你的根节点是指主容器？这是桌子，如果你问的话
如何检测错误？您从哪个元素 (this) 开始？你的 javascript 目前是什么样子的？
function validate() { var err = 0; $("#profileForm").find(".required").each(function(){ var elem = $(this); if(elem.attr("name") == "user_name") { if(!elem.val()) { err++; elem.addClass("errorInput"); elem.next(".error").text(nameErrEmptyMsg); } else if(elem.val().length < 5) { err++; elem.addClass("errorInput"); elem.next(".error").text(nameErrShortMsg); } } else { } }); if(err > 0) { return false; } }

标签： jquery class element next

【解决方案1】：

我知道这可能不是您正在寻找的，但如果您有输入，就像这样：

var input = $('input[name="user_name"]');

那么你可以这样做：

input.parents('tr').eq(0).next().find('.error').text(nameErrEmptyMsg);

【讨论】：

【解决方案2】：

问题在于 .next() 和 .nextAll() 只能通过兄弟姐妹（具有相同父元素的元素）进行搜索。

来自 jQuery 文档：

描述：获取所有关注集合中每个元素的兄弟姐妹匹配的元素，可选过滤通过选择器。

在你的情况下，你有：

  <tr> 
     <td> title here</td> 
     <td><input name="user_name"/> </td>
   </tr>
   <tr>
     <td colspan="2">
       <span class="error"></span>
     </td> 
   </tr>

据我了解，您的 JQuery 代码是在输入上运行的，对吗？在这种情况下，在调用 newxt() 或 nextAll() 之前，您应该先上 2 个级别，直到然后选择下一个，因为有您想要找到的，所以：

这是一个检查它的工作示例： http://jsfiddle.net/EM5Gw/

【讨论】：

【解决方案3】：

试试

  console.log($("td>span").next().find(".error").text())

【讨论】：

我只用IE（其他浏览器禁止用php），所以没有Firebug
您好，关于 FIREBUG 和 IE，您可以获得适用于 IE6+ 的 FIREBUG-LITE。见http://getfirebug.com/firebuglite。

【解决方案4】：

您可以使用next('span.error')：

http://jsfiddle.net/wPZgg/

【讨论】：

你看过 jsfiddle 了吗？这不是你想要它做的吗？另外，您使用的是什么 jquery 版本？
更新 Fiddle JamesHalsall，方法是将您的 tr 添加到一个 div 内的表中，以便它实际呈现。然后你会发现你的代码不起作用。