简体   繁体   English

Firefox无法正确显示和隐藏我的表格。 仅在按钮上显示标题,不按行

[英]Firefox won't show and hide my table properly. Only Shows header on button press not row

Firefox won't show and hide my table properly. Firefox无法正确显示和隐藏我的表格。 Only Shows header on button press not row. 仅在按钮上显示标题,不按行。

Basically what I'm wanting is for when the user clicks the button, the column header with the id "HideMe" and the rows of the same id are shown. 基本上,我想要的是用户单击按钮时要显示的ID为“ HideMe”的列标题和具有相同ID的行。 This works perfectly in Chrome but not in Firefox 这在Chrome中完美运行,但在Firefox中则无法

<html>

<head>
    <title>Show and Hide Javascript won't work in Firefox</title>
    <style>
        #HideMe {
            display:none;
        }
    </style>
    <script src="http://code.jquery.com/jquery-1.8.3.js"></script>
    <script>
        jQuery(document).ready(function ($) {
            $('.ShowPassword').click(function () {
                $(HideMe).show();
            });
        });
    </script>
</head>

<body>
    <table>
        <tr>
            <th>ID Number</th>
            <th>First Name</th>
            <th>Middle Name</th>
            <th id="HideMe">Password</th>
        </tr>
        <tr>
            <td>2121</td>
            <td>Mike</td>
            <td>Daniel</td>
            <td id="HideMe">Password</td>
        </tr>
        <button class="ShowPassword">Show Password</button>
</body>

This is in no way right 这绝对不对

$(HideMe).show();

you may want to do something like: 您可能想要执行以下操作:

$('#HideMe').show();

FIDDLE: http://jsfiddle.net/JS7tK/5/ 内容: http : //jsfiddle.net/JS7tK/5/

I didn't notice at first but as bandi notes in his comment id should be unique. 起初我没有注意到,但正如bandi在他的注释ID中指出的那样,应该是唯一的。 So try to do something like: 因此,尝试执行以下操作:

<html>
    <head>
        <title>Show and Hide Javascript won't work in Firefox</title>
        <style>
            .HideMe {
                display:none;
            }
        </style>
        <script src="http://code.jquery.com/jquery-1.8.3.js"></script>
        <script>
            jQuery(document).ready(function ($) {
                $('.ShowPassword').click(function () {
                    $('.HideMe').show();
                });
            });
        </script>
    </head>

    <body>
        <table>
            <tr>
                <th>ID Number</th>
                <th>First Name</th>
                <th>Middle Name</th>
                <th class="HideMe">Password</th>
            </tr>
            <tr>
                <td>2121</td>
                <td>Mike</td>
                <td>Daniel</td>
                <td class="HideMe">Password</td>
            </tr>
            <button class="ShowPassword">Show Password</button>
    </body>
<html>

我不使用jQuery,但是通常来说,最好将一个span放在&隐藏之内而不是隐藏该单元格,因为这样做会导致表格不平衡,因此某些浏览器不允许这样做并不奇怪它。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM