0

我有以下基本 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;
}

但是，每次单击该按钮时，都会Cannot read property "First Name" of undefined javascript在控制台中收到错误消息。表单元素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>
4

3 回答 3

2

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

这是根据HTML 规范。

于 2012-07-19T21:55:13.297 回答
1

  1. 您应该使用“FirstName”而不是“First Name”。这不是主要问题，因为在文档中找不到“ExampleForm”。

  2. 如果您在 iFrame 中有“ExampleForm”并且您尝试从外部文档访问它，那么您的尝试将失败，在这种情况下，您需要从 iFrame 内的页面访问“ExampleForm”

  3. 如果您的页面位于 iframe 内，并且您尝试访问外部文档中的“ExampleForm”，那么您可以使用 window.parent 属性

于 2012-07-19T22:51:01.157 回答
0

从表单 ExampleForm 中提交的 First Name 的 FirstName 中删除空格。

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

希望这可以帮助

于 2012-07-19T21:59:32.280 回答