Блог

Главная - Вопросы по программированию - сообщение this.value undefined, отображаемое в коде javascript

сообщение this.value undefined, отображаемое в коде javascript

#javascript #html #attributes #getattribute

#javascript #HTML #атрибуты #получить атрибут

Вопрос:

changeText1(id) отображение неопределенной ошибки я хочу значение в атрибуте тега привязки

 function changeText(id) {
  id.innerHTML = "hii";
}

function changeText1(id) {
  var idq = this.value;
  id.innerHTML = idq;
}  
 <!DOCTYPE html>
<html>
<body>
  <h1 onclick="changeText(this)">Click on this text!</h1>
  <h1><a onclick="changeText1(this)" value="123">Click on this text!</a></h1>
</body>
</html>

Комментарии:

1. <!DOCTYPE html> <html> <body> <h1 onclick=»changeText(this)»>Нажмите на этот текст!</h1> <h1><a onclick=»changeText1(this)» value=»123″>Нажмите на этот текст!</a></h1> <script> function changeText(id) { id.innerHTML=»hii»; } function changeText1(id) { var idq=this.value; id.innerHTML=idq; } </script> </body> </html>

2. Можете ли вы удалить свой комментарий? Ему здесь не место.

3. value имеет смысл только для входных элементов, а не <a> для or <h1> .

4. Избавьтесь от этого value в этом <a> и избавьтесь от var idq = this.value; и измените id.innerHTML = idq; на id.innerHTML = '123'; , поскольку вы уже знаете значение. Даже если вы не знаете значение, для которого var предназначены s.

Ответ №1:

Чтобы получить значение из тега привязки, вам нужно сделать следующее

 function changeText1(param) {
  var val = param.getAttribute('value'); // ATTRIBUTE-NAME
  param.innerHTML = val;
}

Ответ №2:

Вам нужно получить getAttribute доступ к нестандартным атрибутам.

Это работает в сочетании с переданным значением this , которое находится id в функции.

Для лучшего понимания кода я предлагаю переименовать эту переменную в element .

 function changeText(element) {
    element.innerHTML = "hii";
}

function changeText1(element) {
    element.innerHTML = element.getAttribute('value');
}  
 <h1 onclick="changeText(this)">Click on this text!</h1>
<h1><a onclick="changeText1(this)" value="123">Click on this text!</a></h1>

Ответ №3:

Пожалуйста, обновите вашу функцию changeText1 с помощью функции ниже. Вероятно, вы не можете получить какой-либо атрибут напрямую.

 function changeText1(id) { 
    var idq = id.getAttribute("value");
    id.innerHTML = idq;
}

Ответ №4:

value недопустимый атрибут для элементов привязки. Если вы хотите сохранить данные приложения в элементе, используйте data-* атрибут и получите к нему доступ с помощью dataset свойства.

 function changeText(id) {
  id.innerHTML = "hii";
}

function changeText1(id) {
  var idq = id.dataset.value;
  id.innerHTML = idq;
}  
 <!DOCTYPE html>
<html>
<body>
  <h1 onclick="changeText(this)">Click on this text!</h1>
  <h1><a onclick="changeText1(this)" data-value="123">Click on this text!</a></h1>
</body>
</html>

Кроме того, вы написали this.value , когда это должно быть id.value . Но исправление этого не решает проблему.

Ответ №5:

Для тега привязки не вызывается атрибут value . Вы можете использовать data для хранения значения.Во-вторых, вы можете использовать одну функцию для обеих задач.

    
function changeText(e) {
  // get the current element which is clicked
  let elem = e.target;
  // check if the current element have any dataset with value as a key
  if (elem.dataset.value) {
    elem.innerHTML = elem.dataset.value;
    return;
  }
  elem.innerHTML = "hii";
}  
 // event is the event object
// value in data-value can be replaced by anything,but prefix data- is necessary 
<h1 onclick="changeText(event)">Click on this text!</h1>
<h1><a onclick="changeText(event)" data-value="123">Click on this text!</a></h1>