JQuery - 获取单选按钮旁边的td值

时间:2010-01-19 16:07:11

标签: jquery html-table parent siblings

我有以下两难困境: 我的HTML就是这样(这存在于PL / SQL应用程序中。):

<table id="search_result_table">
<tr>

<input type=radio name="pv_select" value="'||lv_spriden_id||'"/>
<font face="Calibri" size=3><td id="spriden_id"     name="spriden_id">'||lv_spriden_id||'</td></font>'
<font face="Calibri" size=3><td id="last_name" class="c_last_name"     name="last_name">'||lv_spriden_last_name||'</td></font>
<font face="Calibri" size=3><td id="first_name" class = "c_first_name"     name="first_name">'||lv_spriden_first_name||'</td></font>
</tr>
</table>

我可以通过以下方式获取所选的单选按钮值:

$("input[name=pv_select]:checked").val()

但是,我希望能够获得“last_name”列单元格的值(它存在于单选按钮旁边的表格中)。如何通过jQuery检索此值(通过单选按钮选择的行)?

我尝试了几件事,但都没有工作:

$("input[name=pv_select]:checked").parent().siblings("td:eq(1)").text());    

提前致谢。

3 个答案:

答案 0 :(得分:2)

HTML无效;不确定这是否会破坏你的DOM树,从而混淆jQuery,因为它试图遍历破碎的DOM树。

这是有效的HTML:

<table id="search_result_table">
    <tr>
        <td>
            <input type=radio name="pv_select" value="'||lv_spriden_id||'"/>
        </td>
        <td id="spriden_id" name="spriden_id"><font face="Calibri" size=3>'||lv_spriden_id||'</font></td>
        <td id="last_name" class="c_last_name" name="last_name"><font face="Calibri" size=3>'||lv_spriden_last_name||'</font></td>
        <td id="first_name" class = "c_first_name" name="first_name"><font face="Calibri" size=3>'||lv_spriden_first_name||'</font></td>
    </tr>
</table>

jQuery将“姓氏”表格单元格的值与选中的单选按钮放在同一行:

$("input[name=pv_select]:checked").parent().siblings("td.c_last_name").text());

(我说HTML是有效的:id属性的值在HTML页面中是唯一的,所以如果你有多个行使用表格单元格的相同id属性,那也是无效的。 )

答案 1 :(得分:0)

您的选择器适用于 td 中的输入和其他 td

中的姓氏文字的通用表格

也许你的问题是在提交后声明姓氏,所以你应该尝试用

修改选择器
$("input[name=pv_select]:checked").parent().siblings("td:eq(0)").text();

我刚改变了兄弟的索引(如果我的表转储正确,你的.siblings(“td:eq(1)”)是名字, eq(0)应该是姓氏

只是一个建议..

修改

当你发布你的html摘录时,我意识到,你不需要检查无线电父母的兄弟元素。由于其父级是 tr ,表中 tr 的兄弟只是另一个表行。

你可以考虑使用遍历函数 .next(),它移动到DOM中的下一个元素

很遗憾,我无法在FF中测试这个(或者只是因为Firebug / jquery ext。),但这是代码,你确切地要求(获取无线电输入的下一个元素):

$('input[name="pv_select"]:checked').next();

唯一的问题是,下一个元素是 font 元素,我似乎无法在FF中正确呈现(并且不会驻留在表格行中 - 它直接显示在正文中在FireBug检查器中),所以 .children()找不到 或者您正在尝试查找

答案 2 :(得分:0)

我刚刚意识到这适用于Firefox,但不适用于IE。因此,我将在一个浏览器中分析可能导致此失败的原因而不是另一个浏览器。