IE 中的 jQuery 表单输入计数不同

发布于 2024-10-03 05:37:27 字数 1414 浏览 2 评论 0原文

我在计算 jQuery 中的表单元素时遇到了一个奇怪的问题。虽然我可以解决这个问题,但我想知道是否有人知道为什么以下示例的浏览器之间存在差异?

<!DOCTYPE html 
 PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
    <title>IE Test</title>
    <meta name="description" content="" />
    <meta name="keywords" content="" />
    <meta name="author" content="" />
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js" type="text/javascript"></script>

    <script type="text/javascript">
        $(document).ready(function(){
            alert($('form :input').length);
        });
    </script>
</head>
<body>      
    <div id='wrapper'>
        <div id='header'>
            <form action='#' method='POST'>
                <input type='text' name='title' value='Hotdog Fanatic'></input>
            </form>
        </div>
    </div>

</body>

IE 6/7/8 的结果都是 2,而 FF、chrome、opera 和 safari 的结果都是 1。

如果我更改选择器以按任何属性进行过滤,则计数显示正确。例如,form :input[name]form :input[type] 作为选择器在 IE 中仅返回一个匹配的元素。

有谁知道为什么会这样?

谢谢!

巴普斯。

I'm having a strange issue with counting form elements in jQuery. While I can work around it, I was wondering if anyone knows why there is a difference between browsers with the following example?

<!DOCTYPE html 
 PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
    <title>IE Test</title>
    <meta name="description" content="" />
    <meta name="keywords" content="" />
    <meta name="author" content="" />
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js" type="text/javascript"></script>

    <script type="text/javascript">
        $(document).ready(function(){
            alert($('form :input').length);
        });
    </script>
</head>
<body>      
    <div id='wrapper'>
        <div id='header'>
            <form action='#' method='POST'>
                <input type='text' name='title' value='Hotdog Fanatic'></input>
            </form>
        </div>
    </div>

</body>

IE 6/7/8 all give me a result of 2, while FF, chrome, opera and safari all count 1 matched element.

If I change the selector to filter by any attribute, the count appears correct. For example, form :input[name] or form :input[type] as the selector returns just one matched element in IE.

Does anyone know why this might be?

Thanks!

Baps.

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

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

发布评论

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

评论(2

各自安好 2024-10-10 05:37:27

删除 结束标记。
相反,您应该创建一个自关闭标记:

<input type='text' name='title' value='Hotdog Fanatic' />

将脚本更改为

<script type="text/javascript">
    $(document).ready(function(){
        alert($('form :input')[1].outerHTML);
    });
</script>

“这将提醒 ”。

Remove the </input> end tag.
Instead, you should make a self-closing tag:

<input type='text' name='title' value='Hotdog Fanatic' />

Change your script to

<script type="text/javascript">
    $(document).ready(function(){
        alert($('form :input')[1].outerHTML);
    });
</script>

This will alert </INPUT>.

杯别 2024-10-10 05:37:27

输入元素不是容器,当使用严格的 XHTML 时,将其替换为:

<input type='text' name='title' value='Hotdog Fanatic' />

Input elements are not containers, when using XHTML strict, as you are, replace it with this:

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