Javascript 试图隐藏一个项目块，使其在单击特定文本框时显示，_Javascript_Jquery_Html

Javascript 试图隐藏一个项目块，使其在单击特定文本框时显示，

javascript jquery html

Javascript 试图隐藏一个项目块，使其在单击特定文本框时显示，,javascript,jquery,html,Javascript,Jquery,Html,试图隐藏一个项目块，使其在单击特定文本框时显示，它适用于第一个项目，不适用于其他项目，我需要帮助在页面加载时隐藏其他id，然后在最接近它的文本框中显示id=Control时显示 <html> <body> <table> <tr> &

试图隐藏一个项目块，使其在单击特定文本框时显示，它适用于第一个项目，不适用于其他项目，我需要帮助在页面加载时隐藏其他id，然后在最接近它的文本框中显示id=Control时显示

                    <html>
                    <body>
                    <table>
                    <tr>
                            <td><label>Approved Within 24HRS:</label></td>
                            <td><input name = "LLC_Veri_Approved" type = "text" size = "20" /></td>
                    </tr>
                    <tr>
                            <td><label>Not Approved:</label></td>
                            <td><input id = "control" name = "LLC_Veri_NotApproved" type = "text" size = "20" /></td>
                    </tr>
                    </table>

                    <h4>Number Of Verifications(LLC) Not Approved Reasons</h4>
                    <table id="Rtable">
                    <tr>
                            <td><label>No Receipt Attached:</label></td>
                            <td><input name = "LLC_No_Receipt" type = "text" size = "20" /></td>
                    </tr>
                    <tr>
                            <td><label>No Stamp Duty:</label></td>
                            <td><input name = "LLC_No_Stamp" type = "text" size = "20" /></td>
                    </tr>
                    </table>

                    <table>
                    <tr>
                            <td><label>Approved Within 24HRS:</label></td>
                            <td><input name = "LLC_Veri_Approved" type = "text" size = "20" /></td>
                    </tr>
                    <tr>
                            <td><label>Not Approved:</label></td>
                            <td><input id = "control" name = "LLC_Veri_NotApproved" type = "text" size = "20" /></td>
                    </tr>
                    </table>

                    <h4>Number Of Verifications(BN) Not Approved Reasons</h4>
                    <table id="Rtable">
                    <tr>
                            <td><label>No Receipt Attached:</label></td>
                            <td><input name = "BN_No_Receipt" type = "text" size = "20" /></td>
                    </tr>
                    <tr>
                            <td><label>No Stamp Duty:</label></td>
                            <td><input name = "BN_No_Stamp" type = "text" size = "20" /></td>
                    </tr>
                    </table>

                    <table>
                    <tr>
                            <td><label>Approved Within 24HRS:</label></td>
                            <td><input name = "IT_Veri_Approved" type = "text" size = "20" /></td>
                    </tr>
                    <tr>
                            <td><label>Not Approved:</label></td>
                            <td><input id = "control" name = "IT_Veri_NotApproved" type = "text" size = "20" /></td>
                    </tr>
                    </table>

                    <h4>Number Of Verifications(IT) Not Approved Reasons</h4>
                    <table id="Rtable">
                    <tr>
                            <td><label>No Receipt Attached:</label></td>
                            <td><input name = "IT_No_Receipt" type = "text" size = "20" /></td>
                    </tr>
                    <tr>
                            <td><label>No Stamp Duty:</label></td>
                            <td><input name = "IT_No_Stamp" type = "text" size = "20" /></td>
                    </tr>
                    </table>
            </body>
            <script type="text/javascript">

     $(document).ready(function(){
    //trying to hide all the tables with id=Rtable but works only for the first
    $('#Rtable').hide();

     //when you click on any of the textboxes with id = control
     $('#control').on('click', function(){
        $('#Rtable').show();
     });



});

            </script>
            </html>


24小时内批准：
未批准：
未批准原因的验证（LLC）数量
无收据：
无印花税：
24小时内批准：
未批准：
未批准的验证数量（BN）原因
无收据：
无印花税：
24小时内批准：
未批准：
未批准原因的验证（IT）数量
无收据：
无印花税：
$（文档）.ready（函数（）{
//试图隐藏id=Rtable的所有表，但仅对第一个表有效
$（'#Rtable'）.hide（）；
//当您单击id=control的任何文本框时
$（'#控件'）。在（'单击'，函数（）上）{
$（'#Rtable'）.show（）；
});
});

Id必须是唯一的，对于

控件

和

表

元素，使用类而不是Id：

<input class="control" name="IT_Veri_NotApproved" type="text" size="20" />

演示：它成功地隐藏了所有RTable，但单击class或id=control的任何文本框，所有RTable都会立即显示

$('.control').on('click', function () {
    $(this).closest('table').nextAll('.Rtable:first').show();
});