Question

我在计算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中的一个匹配元素。

有谁知道为什么会这样？

谢谢！

BAPS。

Answer 1

删除</input>结束标记相反，你应该制作一个自我结束的标签：

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

将脚本更改为

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

这会提醒</INPUT>。

Answer 2

输入元素不是容器，当您使用XHTML strict时，请将其替换为：

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

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

2 个答案: