:visible 选择器在 Internet Explorer 中不起作用

发布于 2024-09-13 04:58:59 字数 1940 浏览 5 评论 0原文

我正在为 ASP.Net 网站开发一些基本的表单验证样式。 我需要选择所有可见的 span 元素,并将 css 样式添加到另一个元素。 (只是为了指示哪些输入字段无效。)

下面的代码在 FF 和 Safari 中的效果就像超级按钮一样,但在 IE 中失败。我已将问题范围缩小到 :visible 选择器。这是 jQuery 代码。

重要提示: 生产站点正在运行 jQuery 1.3.1 1.3.2 中对 :visible 选择器进行了更改发行说明

$('span.inputError:visible').each(function() {
            $(this).parent().parent().prev('td').children('label').children('span').css('color','red');
        });

下面是它的渲染 HTML:

<table width="100%" cellspacing="0" cellpadding="3" border="0">
            <tbody>
            <tr>
                <td valign="top" style="text-align: right;" class="address_labels">
                    <label><span>*</span> First Name: </label>
                </td>
                <td>
                    <span id="ctl00_CMain_txtFirstName_wrapper"><input type="text" style="width: 190px;" invalidstyle="inputError" class="radEnabledCss Input" name="ctl00_CMain_txtFirstName_text" id="ctl00_CMain_txtFirstName_text" size="20" value=" zdogg"><input type="text" value=" zdogg" style="border: 0pt none ; margin: -18px 0pt 0pt; padding: 0pt; overflow: hidden; visibility: hidden; width: 1px; height: 1px;" name="ctl00$CMain$txtFirstName" id="ctl00_CMain_txtFirstName"><input type="hidden" name="ctl00_CMain_txtFirstName_ClientState" id="ctl00_CMain_txtFirstName_ClientState" autocomplete="off"></span>
                    <div>
                            <span style="color: Red; display: none;" class="inputError" id="ctl00_CMain_valFirstName">First name is required</span>
                        </div>        
                </td>
            </tr>

        </tbody></table>

I'm working on some basic form validation styles for an ASP.Net website.
I need to select all span elements that are visible, and add a css style to another element. (Just to indicate which input fields are invalid.)

The below code works like a charm in FF and Safari, but fails in IE. I've narrowed the problem down to the :visible selector. Here's the jQuery code.

IMPORTANT NOTE: Production site is running jQuery 1.3.1 There were changes made to the :visible selector in 1.3.2 release notes

$('span.inputError:visible').each(function() {
            $(this).parent().parent().prev('td').children('label').children('span').css('color','red');
        });

Here's the rendered HTML it's intended for:

<table width="100%" cellspacing="0" cellpadding="3" border="0">
            <tbody>
            <tr>
                <td valign="top" style="text-align: right;" class="address_labels">
                    <label><span>*</span> First Name: </label>
                </td>
                <td>
                    <span id="ctl00_CMain_txtFirstName_wrapper"><input type="text" style="width: 190px;" invalidstyle="inputError" class="radEnabledCss Input" name="ctl00_CMain_txtFirstName_text" id="ctl00_CMain_txtFirstName_text" size="20" value=" zdogg"><input type="text" value=" zdogg" style="border: 0pt none ; margin: -18px 0pt 0pt; padding: 0pt; overflow: hidden; visibility: hidden; width: 1px; height: 1px;" name="ctl00$CMain$txtFirstName" id="ctl00_CMain_txtFirstName"><input type="hidden" name="ctl00_CMain_txtFirstName_ClientState" id="ctl00_CMain_txtFirstName_ClientState" autocomplete="off"></span>
                    <div>
                            <span style="color: Red; display: none;" class="inputError" id="ctl00_CMain_valFirstName">First name is required</span>
                        </div>        
                </td>
            </tr>

        </tbody></table>

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

锦爱 2024-09-20 04:58:59

我将您的代码放在: http://jsfiddle.net/BZRWF/1/
使用jquery 1.2.6,它似乎可以工作(我添加了一个按钮来单击以实例化事件)。我在兼容模式下使用 IE8 进行了测试,没有任何问题。

我还在 1.3.2 和 1.4.2 中进行了测试,并且在那里也工作正常。

I put your code up on: http://jsfiddle.net/BZRWF/1/
using jquery 1.2.6, and it seems to work (I added a button to click to instantiate the event). I tested using IE8 in compatibility mode with no issues.

I also tested in 1.3.2 and 1.4.2 and it works ok there also.

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文