Uncaught TypeError: невозможно установить свойство 'type' равным null - PullRequest
0 голосов
/ 11 июля 2020

Я использую главную страницу в asp. net и получаю следующую ошибку в chrome консоли инструмента проверки браузера.

Uncaught TypeError: невозможно установить тип свойства 'нулевого значения в myFunction (StudentPassword.aspx: 258) в HTMLInputElement.onclick

Я предполагаю, что проблема в теге скрипта. где мне его разместить? Внутри тега, внизу страницы контента или внизу главной страницы?

Мастер-страница:

  <%@ Master Language="C#" AutoEventWireup="true" CodeBehind="Student.master.cs" Inherits="Project_Placements.Student" %>

 <!DOCTYPE HTML>

 <HTML>
 <head runat="server">
 </head>
 <body>
 <asp:ContentPlaceHolder ID="ContentPlaceHolder1" runat="server">
        </asp:ContentPlaceHolder>
  <script type="text/javascript">
   
       function myFunction() {
           var checkBox = document.getElementById("myCheck");
           var pwd = document.getElementById("password");
           if (checkBox.checked == true) {
               pwd.type = 'password';
           } else {
               pwd.type = 'text';
           }
       }
   }
   </script>    
   </body>
   </html>

, а код страницы контента выглядит следующим образом:

 <%@ Page Title="" Language="C#" MasterPageFile="~/Student.Master" AutoEventWireup="true" 
 CodeBehind="StudentPassword.aspx.cs" Inherits="Project_Placements.WebForm7" %>

 <asp:Content ID="Content3" ContentPlaceHolderID="ContentPlaceHolder1" runat="server">    
<form id="form1" runat="server">
 <asp:TextBox ID="password" runat="server"  TextMode="Password" ></asp:TextBox>
 <label for="myCheck">Show Password :</label> 
  <input type="checkbox" id="myCheck" onclick="myFunction()">
  </form>
  </asp:Content>

 

Ответы [ 2 ]

1 голос
/ 11 июля 2020

ASP. Net связывает все id родительских элементов на стороне сервера с id текущего элемента, если они не были перезаписаны на сервере. Таким образом, выведенный id на самом деле выглядит примерно как ContentPlaceHolder1$Content3$form1$password.

Вы можете использовать селектор концов, чтобы опустить это.

var pwd = document.querySelector("[id$=password]").

Но имейте в виду, что нужно выбирать уникальный id, который также будет уникальным с использованием конца на.

В качестве альтернативы вы можете использовать атрибут данных и выбрать его:

<asp:TextBox ID="password" runat="server"  TextMode="Password" data-id="password" />
var pwd = document.querySelector("[data-id=password]");

Наконец, вы можете использовать что-то например:

var pwd = document.getElementById('<%=password.ClientID %>');

Но мне это никогда не нравилось, и он требует, чтобы скрипт был встроенным.

0 голосов
/ 11 июля 2020

Вы получаете сообщение об ошибке, потому что скрипт загружается до того, как DOM будет полностью отрисован. Попробуйте поместить содержимое вашего скрипта в document.ready, и это должно решить проблему.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...