Question

无法读取 null 的属性“innerHTML”

2012-12-17

18383

javascript asp.net html

我是 javascript 的初学者。

js 文件

         var msgErrorPalletizedWeight = document.getElementById('msgError');
         function palletizedWeightValidation() {
              console.log("hello");
/*ERROR*/     msgErrorPalletizedWeight.innerHTML += ("Please enter all the values marked with *");
         }

HTML

<head runat="server">
   <title></title>
   <link href="Styles/Site.css" rel="stylesheet" type="text/css" />
   <script src="Scripts/file.js" type="text/javascript"></script>
</head>
<body>
    <p id="msgError"></p>
    <asp:Button ID="btnSubmitPalletized" runat="server" Text="Submit" 
                   OnClientClick="palletizedWeightValidation()" />
</body>

错误

Cannot read property 'innerHTML' of null

在询问这里之前，我搜索了很多网站，他们都建议在验证之前检查是否为 null，我可以这样做，但我的问题是，我想向 p 标签添加一些文本，如您所见。如何实现？我甚至尝试追加，认为这可能会解决问题。我知道这是一个愚蠢的错误，因为有很多关于此的帖子……问题是我不明白我哪里做错了。

请帮忙。

Answer 1

您 尝试 在 html 尚未 就绪 时访问 元素 ，请将语句放在事件函数中以获取函数 palletizedWeightValidation 中的元素。

      function palletizedWeightValidation() {
              var msgErrorPalletizedWeight = document.getElementById('msgError');
              console.log("hello");
/*ERROR*/     msgErrorPalletizedWeight.innerHTML += ("Please enter all the values marked ith *");
         }

编辑 要停止回发 ，您需要从 javascrip 函数返回 false。

 <asp:Button ID="btnSubmitPalletized" runat="server" Text="Submit" 
                   OnClientClick="return palletizedWeightValidation()" />


      function palletizedWeightValidation() {
              var msgErrorPalletizedWeight = document.getElementById('msgError');
              console.log("hello");
/*ERROR*/     msgErrorPalletizedWeight.innerHTML += ("Please enter all the values marked ith *");
              return false; // returning true will cause postback.
         }

Answer 2

重要的是您的 js 文件何时执行。如果您在 head 标签内加载 js 文件，则您的文件将在创建 DOM 之前执行。这意味着 document.getElementById 函数返回 null。

Answer 3

您收到的错误是由于您尝试读取 NULL 对象的属性而导致的。这意味着您的行：

var msgErrorPalletizedWeight = document.getElementById('msgError');

未在您的页面上找到任何元素。