javascript - 无法读取未定义 JavaScript 的属性 "First Name"

Question

我有以下基本的 javascript 函数，当 onClick 事件发生时我会调用它

function testMe() {
    var oForm = document.forms["ExampleForm"]["First Name"].value;
    console.log(oForm);
    if (oForm == "") {
        window.alert("This is a test");
    }
    return false;
}

但是，每次单击该按钮时，我都会在控制台中收到错误无法读取未定义的 javascript 的属性“First Name”。表单元素 First Name 存在，并且表单名称为 ExampleForm

我忽略了什么或做错了什么？

编辑 0

虽然我在 http://jsfiddle.net/3Ayd8 运行的示例当我在内部网站的页面上运行相同的代码时，它可以工作，但它不起作用。

编辑 1

这是console.log(document.forms)的输出

<form method="post" action="sample.aspx" id="form">

<script type="text/javascript">
//<![CDATA[
var theForm = document.forms['form'];
if (!theForm) {
    theForm = document.form;
}
function __doPostBack(eventTarget, eventArgument) {
    if (!theForm.onsubmit || (theForm.onsubmit() != false)) {
        theForm.__EVENTTARGET.value = eventTarget;
        theForm.__EVENTARGUMENT.value = eventArgument;
        theForm.submit();
    }
}
//]]>
</script>

<script type="text/javascript">
    //<![CDATA[

function NewDocument(parentNodeId, classId){ 
    if (parent != window) { 
        parent.NewDocument(parentNodeId, classId); 
    } else { 
        window.top.document.location = '/default.aspx?section=content&action=new&nodeid=' + parentNodeId + '&classid=' + classId; 
    } 
}
function NotAllowed(action){ 
    if (parent != window) { 
        parent.NotAllowed('', action); 
    } else { 
        window.top.document.location = '/default.aspx?section=content&action=notallowed&subaction=' + action; 
    } 
}
function DeleteDocument(nodeId) { 
    if (parent != window) { 
        parent.DeleteDocument(nodeId); 
    } else { 
        window.top.document.location = '/default.aspx?section=content&action=delete&nodeid=' + nodeId; 
    } 
}
function EditDocument(nodeId) { 
    if (parent != window) { 
        parent.EditDocument(nodeId); 
    } else { 
        window.top.document.location = '//default.aspx?section=content&action=edit&nodeid=' + nodeId; 
    } 
}
//]]>
<input type="hidden" name="vmode" id="vmode" value="2">
</div>
<script src="/GetResource.ashx?scriptfile=%2fCMSScripts%2fcmsedit.js" type="text/javascript"></script>
<script src="/ScriptResource.axd?d=aK015nKOf8Jw44OCiklcSydFiWaSIB9l6ZwdCQaMAWlevtaFiOw7Urzac1pIZ9Rs0&amp;t=34d147fd" type="text/javascript"></script>
<script src="/ScriptResource.axd?d=aK015nKOf8Jw44OCiklcSydFiWaSIB9l6ZwdCQaMAWm_idfkOBcdRXBrkc0cxAR10&amp;t=34d147fd" type="text/javascript"></script>
<div class="aspNetHidden">

    <input type="hidden" name="__SCROLLPOSITIONX" id="__SCROLLPOSITIONX" value="0">
    <input type="hidden" name="__SCROLLPOSITIONY" id="__SCROLLPOSITIONY" value="0">
</div>
    <div id="manPortal" style="background:none;">
    <div id="CMSHeaderPad" style="height: 22px; line-height: 0px; "></div><div id="CMSHeaderDiv" style="position: fixed; top: 0px; left: 0px; right: 0px; bottom: auto; z-index: 10000; overflow: hidden; width: 100%; ">
<script type="text/javascript">
    //<![CDATA[
if ( (parent != null) && (parent.IsCMSDesk) ) { infoElem = document.getElementById('manPortal_pnlPreviewInfo'); if (infoElem) {if ( infoElem.style ) { infoElem.style.display = 'none'; } else { infoElem.display = 'none'; } }}
//]]>
</script><!-- -->
    </div>
</div><script type="text/javascript">
//<![CDATA[
Sys.WebForms.PageRequestManager._initialize('manScript', 'form', [], [], [], 90, '');
//]]>
</script>


<script type="text/javascript" src="/jquery-1.4.2.min.js"></script>
 <script type="text/javascript" src="/jquery-ui-1.8.10.custom.min.js"></script>
<script type="text/javascript" src="/plugins.js"></script>
<script type="text/javascript" src="/script.js?v=0.4"></script>

    <div class="zoneMainContent">
<div class="one-col-layout">
    <div class="col-one">
    <script type="text/javascript">
function testMe() {
    console.log(document.forms);
    console.log(document.getElementById("ExampleForm"));
    return false;
}
</script>

    <input id="FirstName" name="FirstName" type="text" value=""> <input name="submit" onclick="return testMe();" type="submit" value="submit">

    </div>
</div>
        <div style="clear:both;line-height:0px;height:0px;"></div>
    </div>
</div></form>

Answer 1

元素的名称或 ID 中不能有空格。

这是根据HTML spec .