使用选择器使用jquery隐藏元素

时间:2012-09-13 19:42:38

标签: jquery jquery-selectors hide

1个问题1.说我有这个:

<body>
    <form>
        <h3>blah</h3>
        <table>
            <tr>
                <th>Input 1:</th>
                <td><input type="text" id="some-input-a" name="some-input-a" /></td>
            </tr>
            <tr>
                <th>Input 2:</th>
                <td><input type="text" id="other-input" name="other-input" /></td>
            </tr>
        </table>
        <h3>blah</h3>
        <table>
            <tr>
                <th>Input 3:</th>
                <td>
                    <select name="my-select" id="my-select">
                        <option value="1">My 1</option>
                        <option value="c">Your f</option>
                        <option value="m">This g</option>
                    </select>
                </td>
            </tr>
            <tr>
                <th>Input 4:</th>
                <td><input type="password" id="pass-input" name="next-input" /></td>
            </tr>
            <tr>
                <th>Input 5:</th>
                <td><input type="password" id="pass-confirm" name="pass-confirm" /></td>
            </tr>
        </table>
        <h3>blah</h3>
        <table>
            <tr>
                <th>Input 6:</th>
                <td><input type="text" id="next-one" name="next-one" /></td>
            </tr>
            <tr>
                <th>Input 7:</th>
                <td><input type="text" id="more-inputs" name="more-inputs" /></td>
            </tr>
            <tr>
                <th>Input 8:</th>
                <td><input type="text" id="form-input" name="form-input" /></td>
            </tr>
            <tr>
                <th>Input 9:</th>
                <td><textarea name="description" id="description" rows="5" cols="30"></textarea></td>
            </tr>
            <tr>
                <th>Input 10:</th>
                <td><input type="text" id="input-10" name="input-10" /></td>
            </tr>
        </table>
    </form>
</body>

有一种简单的隐藏方式:

  1. 第三张表完全
  2. Textarea所在的行
  3. 元素ID为“description”的行
  4. 第3张表的第2行
  5. 第3个<h3>
  6. 第五个输入标签
  7. 使用选择器

2 个答案:

答案 0 :(得分:5)

1

$('form table:eq(2)').hide();

2

$('form table tr').has('textarea').hide();

3

$('#description').hide();

4

$('form table:eq(2) tr:eq(1)').hide();

5

$('form h3:eq(2)').hide();

6

$('form input:eq(4)').parent().prev('td').hide();

了解 jQuery selectors

答案 1 :(得分:1)

你使用.hide()隐藏元素..你也有很多重复的问题。试试这个

 1.) $('table:eq(2)').hide();

    2.) $('table tr').has('textarea').hide();

    3.) $('#description').parent().parent().hide();

    4.) $('table:eq(2) tr:eq(1)').hide();    

    5.) $('h3:eq(2)').hide();

    6.) $('table input:ep(4)').hide();
相关问题