jquery - 表格中的不可见/可见提交按钮

Question

我有 2 行的表格。这些行包含一个文本框和一个提交按钮。

问题:

当用户单击文本框时，提交按钮应该是可见的。我该怎么做。 我尝试使用最近的函数，但它不起作用。

HTML代码

<table id="table1">
    <tr><td><input type="text"/></td><td><input type="submit" value="validate" style="display:none"/></td></tr>
    <tr><td><input type="text"/></td><td><input type="submit" value="validate" style="display:none"/></td></tr>
</table>

JQuery

$(文档).ready(函数(){

    $( "#table1" ).on( "click", "input:text", function( event ) {
        var parent = $(this).closest('td').show();
        alert('Clicked')
    })

})

http://jsfiddle.net/92HHG/1/

Answer 1

在这里您可以使用 closest() 定位 td 然后导航到下一个 td 并找到 submit按钮

$(this).closest('td').next('td').find(':submit').show();

DEMO

或

在这里您可以使用 closest() 定位 tr 然后找到 submit 按钮

$(this).closest('tr').find(':submit').show();

DEMO 2