0

我的屏幕上有这个字段，它是一个文本输入字段，但是当我尝试从 JS 访问该值时，它返回 null

下面我附上了一个屏幕截图，您可以在其中看到 Chrome 存储了值（见左面板），而 JavaScript 无法获取值（底部面板），底部面板的上半部分可以看到 html 代码。

现在我也不确定这是否会有所帮助，但字段是使用 PHP 动态创建的，并且脚本注册在 html 文档的顶部。我的 HTML 页面上只有一个具有该名称的字段

完整的 HTML 代码

<body>
<link href="Objects.css" rel="stylesheet" type="text/css">
<script src="eFarmClicks.js"></script>
<div class="ContentPanel"><label class="HeadingLabel">ADD GROUP</label>
    <table>
        <tbody>
            <tr>
                 <td><label>GROUP NAME</label></td>
                 <td><input type="text" name="edtGroupName"></td>
            </tr>
            <tr>
                <td><label>MAX ANIMALS</label></td>
                <td><input type="text" name="edtMaxAnimal"></td>
            </tr>
            <tr>
                <td><label>MAX MALE ANIMALS</label></td>
                <td><input type="text" name="edtMaxMAnimal"></td>
            </tr>
            <tr>
                <td><label>MAX FEMALE ANIMALS</label></td>
                <td><input type="text" name="edtMaxFAnimal"></td>
            </tr>
        </tbody>
    </table>
    <input type="submit" name="btnSubmitAddGroup" value="Add Group" onclick="btnSubmitAddGroup_click()" ;="" onmousemove="mousemove(this)" onmouseout="mouseout(this)" style="background-color: green;">
</div>
</body>

很抱歉代码粘贴的方式。它是直接从chrome中复制出来的。

截屏

** 编辑 **

我的 JavaScript 代码：

function btnSubmitAddGroup_click(){
var xmlhttp = new XMLHttpRequest();
var groupname = document.getElementsByName('edtGroupName').item(0).value;
var max1 = document.getElementsByName('edtMaxAnimal').item(0).value;
var max2 = document.getElementsByName('edtMaxMAnimal').item(0).value;
var max3 = document.getElementsByName('edtMaxFAnimal').item(0).value;
alert(max1); // to test the value
};

**鼠标移动功能**

function mousemove(obj){
    if(document.getElementsByName(obj.name).item(0).style.backgroundColor!="blue")
    {document.getElementsByName(obj.name).item(0).style.backgroundColor="Green";};
};

function mouseout(obj){
    if(document.getElementsByName(obj.name).item(0).style.backgroundColor!="blue"){
        document.getElementsByName(obj.name).item(0).style.backgroundColor="transparent";
    };
};

****编辑今天的4 **

（也在我的评论中）

伙计们，这将如何影响我的代码？我刚刚意识到提及编辑在 iframe 中可能是相关的。当我检查这个命令时，我意识到这可能是相关的 document.getElementsByTagName('input')

4

1 回答 1

0

好的，我找到了问题，我要感谢这个链接和这个链接帮助我找到答案。

好的，这是实际的问题：

  • iframe 是动态创建的
  • 并且输入在 iframe 中（起初我觉得没有必要在原始问题中说）
  • 但经过一些进一步的研究和审查后，我发现这是问题的原因

我假设它是因为输入在 iframe 中，这是一个单独的文档（我仍然处于更正状态）。所以获取值的实际代码是

document.getElementById('content').contentDocument.getElementsByName('edtGroupName').item(0).value

这也可以使用链接中提到的方法来解决。

对于所有使用 js 的初学者来说，这就是代码的作用：

//this gets the i frame of the current page
document.getElementById('content')
// this is the document (or if you will, the page loaded in the iframe)
document.getElementById('content').contentDocument
//this gets my edit on my page of the frame
document.getElementById('content').contentDocument.getElementsByName('edtGroupName')
// and this simply gets the input value
document.getElementById('content').contentDocument.getElementsByName('edtGroupName').item(0).value
于 2013-09-09T13:28:24.037 回答