jQuery在相同的tr不同的td中选择隐藏的输入元素答案

【问题标题】：jQuery selecting hidden input element in same tr different tdjQuery在相同的tr不同的td中选择隐藏的输入元素
【发布时间】：2014-09-24 20:59:11
【问题描述】：

我在选择相同 tr 但不同 td 中的隐藏输入字段时遇到问题。在我的 Javascript 下方：

function MarkAsChanged() {
    $(this).addClass('changed');
    var $row = $(this).closest('td').prev('td > input[type="hidden"]');
    $row.addClass('changed');
}
$(':input[type="text"]').blur(MarkAsChanged).change(MarkAsChanged);

如您所见，我尝试了一些选择器（var $row）。代码中的“this”指的是以下HTML代码中的输入元素“blabla-text”：

<tr>
<td><input type="hidden" value="1" name="blabla-hidden"></input></td>
<td>foo 1</td>
<td>foo 2</td>
<td></td>
<td><input type="text" value="2" name="blabla-text"></input></td>
</tr>

因此，如果您更改输入“blabla-text”中的值，我希望隐藏输入字段将类更改为“已更改”。我不能在选择器中使用名称/ID，因为该表有多行，我只想将更改的数据发布到我的 PHP（所以我只发布 class=changed 的文本字段）。 Javascript 适用于文本字段，但不适用于隐藏字段。

我真的希望我说清楚了，如果不是，请告诉我如何详细说明。

提前致谢！

【问题讨论】：

所以只需选择行并找到隐藏的输入。 .clostest("tr").find('input[type="hidden"]')
为什么不简单$(this).closest('tr').find('input[type="hidden"]')？

标签： javascript jquery html

【解决方案1】：

试试这个：

function MarkAsChanged()
{
   $(this).addClass('changed');
   var $row = $(this).closest('tr').find('input[type="hidden"]');
   $row.addClass('changed');
}
$('input[type="text"]').blur(MarkAsChanged).change(MarkAsChanged);

演示：

你必须找到最近的'tr'标签并使用'find'找到隐藏字段。

http://jsfiddle.net/ymm6j4rq/

【讨论】：

非常感谢！有时答案可能很简单:)

【解决方案2】：

您可以根据您的表结构使用此代码：

    <table>
        <tr>
        <td><input type="hidden" value="1" name="blabla-hidden"></input></td>
        <td>foo 1</td>
        <td>foo 2</td>
        <td></td>
        <td><input type="text" onkeyup="MarkAsChanged(this);" value="2" name="blabla-text"></input></td>
        </tr>
    </table>

    <script>



        function MarkAsChanged(curObj)
        {
           $(curObj).addClass('changed');   //curObj is Your Textbox

           var hiddenFieldObj = $(curObj).parent('td').parent('tr').find('td').eq(0).find('input[type="hidden"]');  //hiddenFieldObj is Your Hidden Field

           $(hiddenFieldObj).addClass('changed');             
        }           

    </script>

希望对你有用

【讨论】：