getElementById后是否为null？

Question

我确信这里有一个非常简单的错误，但基本上我有一个 id 为 formID 的表单，我像这样调用它：

<script type="text/javascript">
    function redvalidate() {
        var form = document.getElementById("formID")
        var fields = form.getElementsByClassName("validate"),

我收到错误：form is null

有人能发现错误吗？

（PS 将其称为表单的提交）

更新 好吧，基本上我有两个 onsubmit 一个表单，这显然不起作用。所以我正在做的是从另一个函数中调用这个函数...

这是表单标签：

<form name="purchaseform" id="formID" onSubmit="RememberFormFields('purchaseform','name,email,ship_to,phone_extension,pi_name');" action="process.php" method="post" enctype="multipart/form-data">

这是 RememberFormFields：

    <script type="text/javascript">
function RememberFormFields(form,list)
{
redvalidate()

...etc... rememberformfields function ...et.c..

Answer 1

他在提交表单时调用该函数，因此在调用该函数时肯定已经加载了表单。
（请参见此处 http://jsfiddle.net/HaajY/）

我宁愿在id 或类似的东西。
但需要看到更多才能发现问题。

更新：
您需要将元素作为参数传递给函数。

这将起作用：

<script type="text/javascript">
function redvalidate(elem) {
var fields = elem.getElementsByClassName("validate")
alert(fields)
}

function RememberFormFields(elem,form,list)
{
    redvalidate(elem);
}
</script>
<form name="purchaseform" id="formID" onSubmit="RememberFormFields(this,'purchaseform','name,email,ship_to,phone_extension,pi_name');" method="post" enctype="multipart/form-data">
    <input type="submit"/>
</form>

在此处查看它的实际情况：http://jsfiddle.net/HaajY/2/

Answer 2

假设您的页面上有 html

，您只需要推迟 javascript 的加载，直到 DOM 准备就绪。您试图从尚未应用于 DOM 的元素获取 ID，因此 JavaScript 将其视为 NULL。

有很多方法可以实现这一目标。你可以把所有的JS放在标签附近，你可以使用Google 建议的延迟 JavaScript 加载实践，它将所有 JS 从正文底部附加到 中。

这是 JQuery 如此方便的原因之一，因为您可以将代码包装在 $(document).ready(function(){}); 块中，这样任何 DOM 操作脚本都将始终有效，因为它们等到 DOM 创建完毕后再触发。它通过在现代浏览器中查找“DOMContentLoaded”事件来实现这一点，并为 IE 提供一个 doScrollCheck() 函数，该函数尝试一遍又一遍地滚动正文 - 如果它是可滚动的，他们知道最好去。如果您不想为此加载 JQuery，则可以轻松复制此实践。

JQuery 的 DOM 就绪检查：

if ( document.addEventListener ) {
    DOMContentLoaded = function() {
        document.removeEventListener( "DOMContentLoaded", DOMContentLoaded, false );
        jQuery.ready();
    };

} else if ( document.attachEvent ) {
    DOMContentLoaded = function() {
        // Make sure body exists, at least, in case IE gets a little overzealous (ticket #5443).
        if ( document.readyState === "complete" ) {
            document.detachEvent( "onreadystatechange", DOMContentLoaded );
            jQuery.ready();
        }
    };
}

// The DOM ready check for Internet Explorer
function doScrollCheck() {
    if ( jQuery.isReady ) {
        return;
    }

    try {
        // If IE is used, use the trick by Diego Perini
        // http://javascript.nwbox.com/IEContentLoaded/
        document.documentElement.doScroll("left");
    } catch(e) {
        setTimeout( doScrollCheck, 1 );
        return;
    }

    // and execute any waiting functions
    jQuery.ready();
}

return jQuery;

})();

Answer 3

您还可以有嵌套的表单，即表单内的表单。

<form>
    <form id="nested-form">
        <!-- html -->   
    </form>
</form>

在这种情况下，使用 document.getElementById("nested-form") 无法检测到嵌套表单，并且该函数将返回 null。

Answer 4

这只是因为该函数在 DOM 对象加载之前执行。使用 body 标签的“onload”函数来调用您的函数。或者使用 jQuery 的 $(document).ready() 函数来处理所有事情。