1

<form>在过去的一天半里,我遇到了 jQuery 无法在我的 HTML 中找到元素的问题。我多次通过验证器运行我的 HTML,验证了我的 JS 和 CSS,甚至删除了不必要的 JS 和 CSS 文件,现在简化为:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">

<html>
<head>
    <title>Test</title>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
    <link rel="stylesheet" type="text/css" href="http://yui.yahooapis.com/2.8.0r4/build/reset/reset-min.css" />
</head>

<body>
    <form>
        <input type="textbox" name="action" value="view"></input>
        <button>Test</button>
    </form>
</body>
</html>

在将我的 HTML 简化为基本内容后,我检查了 jQuery 是否可以简单地<form>使用 $('form'). 好吧,jQuery 什么也没返回。它完全崩溃了。它什么也没返回,甚至没有返回一个 jQuery 对象。所以我再一次继续我的精神错乱,验证 HTML 等等,但仍然一无所获!

我第二次重写了 HTML,但方式不完全相同,它成功了!所以我区分了这两个文件并开始调整原始文件以逐渐与我刚刚编写的新文件相同。事实证明,name属性的值是搞砸一切的罪魁祸首!只需将值更改为action允许 jQuery 最终拾取<form>元素之外的任何值!真的?!!@#%$!@#!!!

所以我的问题是: jQuery 中的关键字action什么,属性的值是如何搞砸一切的?

如果它是一个关键字并且您不想解释原因,请您指向我的文档,以便我可以在阅读后打自己的头。属性的值会搞砸事情似乎仍然很奇怪,但这可能是因为我对 jQuery 的实现一无所知。=)

4

6 回答 6

1

action 是 jQuery 中的关键字吗?属性的值是如何搞砸一切的?

不它不是。你的问题出在其他地方。也许您正试图直接在 HTML 头部中获取表单,而不是等待页面完成加载。

例如你做了

<script>
    alert($('form').length); // May return 0 depending on the browser used.
</script>
...
<form>
    ...
</form>

代替

<script>
    $(document).ready(function() {
        alert($('form').length); // Always returns 1.
    });
</script>
...
<form>
    ...
</form>
于 2009-12-23T16:01:43.227 回答
1

我只是复制/粘贴了您的示例代码并添加了

<script type="text/javascript">
    jQuery('form').html('It works fine');
</script>

…在表单元素之后。表单的内容被替换为“它工作正常”,所以,jQuery 没有这个问题。

于 2009-12-23T16:03:42.177 回答
1

如果我没记错的话,如果您使用 name="action",Internet Explorer (6) 中可能会出现问题。不知何故,动作是一个保留字。不记得后果的想法,但事情没有奏效。因此,如果您使用的是 MSIE,请尝试使用其他浏览器。

于 2009-12-23T16:24:43.793 回答
1

无法重现您的问题

检查这个网站http://jsbin.com/ixixu3

对于alert所有不同的选择器,总是显示 1(在 Opera 10.10、IE6、FF 3.5.6 中测试)

于 2009-12-23T17:35:54.950 回答
0

ACTION 是 FORM 标记的必需属性。

编辑

您给定的示例不是有效的 HTML。尝试:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
    <title>Test</title>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
    <script type="text/javascript">
    $(document).ready(function() {
        $('form').css({"border":"1px solid red"});
    });
    </script>
</head>
<body>
    <form action="">
    <fieldset><legend>Test</legend>
        <input type="text" name="action" value="view"/>
        <button>Test</button>
        </fieldset>
    </form>
</body>
</html>
于 2009-12-23T16:01:39.717 回答
0

感谢大家提供的所有信息。我应该提到我正在使用 FF3.5 并使用 Firebug 控制台进行测试。我会加载页面,然后$('form')在 Firebug 中执行。每次我将name属性设置为action. 将其更改为其他内容后,在 Firebug 控制台中执行同一行代码即可。

<script>在阅读了每个人的帖子后,我通过在该部分添加一个元素来编辑我的 HTML <head>

<head>
    <title>Test</title>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
    <link rel="stylesheet" type="text/css" href="http://yui.yahooapis.com/2.8.0r4/build/reset/reset-min.css" />
    <script type="text/javascript">
        $(function(){
           alert($('form').length); 
        });
    </script>
</head>

这工作得很好。所以我想我的错误在于我的测试方法。$('form').length在 Firebug 控制台中使用不会产生任何结果。我应该改用这一行:$(function(){$('form');});$(function(){$('form');})` 我认为在尝试使用萤火虫控制台;我错了。

故事的寓意:即使在 Firebug 中,您仍然需要在选择元素之前检查文档是否准备就绪。

但仍然困扰我的是,当name属性不是 action时,我原来的测试方法适用于 Firebug 控制台。所以也许真正的问题应该是:Firebug 对元素属性的值action有何不满name<input>啊,好吧,我们会再保存一次。

感谢大家的帮助!你所有的帖子都让我最终意识到,太糟糕了,我不能给每个人打勾,但我会给每个人投票!

于 2009-12-24T17:17:41.267 回答