Невозможно изменить текстовое содержимое поля ввода с помощью javascript

Я пытаюсь изменить текст в поле ввода на имя пользователя. id для поля is_username.

А в своем файле Javascript я пробовал

document.getElementById("id_username").innerHTML = "Username";

document.getElementById("id_username").value = "Username";

document.querySelector(".id_username").textContent = "Username";

Ни один не работает... Этот сайт работает на django. Я знаю, что в html для этого можно использовать placeholder, но эти поля создаются с помощью тегов django.

Есть идеи?

Я попробовал использовать эти методы для обычного поля ввода html и также не добился успеха.

Хотелось бы отметить, что когда вы пробовали свой queryselector. Вы использовали ".id_username", это выбирает класс, который так называется, а не id.

Вы можете попробовать сохранить выбранный элемент в переменной, а затем выполнить innerHTML/textcontent.

const stubbornInput = document.getElementById("id_username");

stubbornInput.innerHTML = 'Whatever you want';

У меня были случаи, когда это срабатывало, но когда я шел прямо на вещь, это не помогало. Не уверен, что это поможет или почему это сработало для меня раньше, но попробовать стоит :)

Вы можете попробовать следующее:

document.querySelector('input[name="id_username"]').value = 'Username';
<input type="text" name="id_username" id="id_username" placeholder="Your text">

ваш текстовый ввод имеет ID username, в вашем javascript написано id_username попробуйте этот ввод и javascript.

document.getElementById("username").value = "your_value_here";
<input type="text" name="username" id="username">

Если это не работает, попробуйте использовать JQuery.

$("input[name=username]").val("hello_world")

ок ниже правильный ответ:

Мой основной js файл вызывал проблему, поэтому он не работал у меня раньше. После того, как я создал пустой js файл для этой цели, все заработало.

document.querySelector('#id_username').value = 'username' ;
document.querySelector('#id_username').addEventListener('click', function () {
  document.querySelector('#id_username').value = '';
})

Нашел более простой способ сделать это:

document.querySelector('#id_username').setAttribute('placeholder', 'Username');

Вернуться на верх