Вопрос задан 26.07.2018 в 16:13. Предмет Информатика. Спрашивает Шляхтина Варвара.

Bootstrap - помогите сделать, что бы по enter содержимое текстового поля должно появляться в конце

списка, а само текстовое поле очищаться. Элементы списка должны удаляться при нажатии

Перейти к ответам

Отвечу на вопрос мгновенно! Нейросеть ChatGPT. Жми!

Ответы на вопрос

Внимание! Ответы на вопросы дают живые люди. Они могут содержать ошибочную информацию, заблуждения, а также ответы могут быть сгенерированы нейросетями. Будьте внимательны. Если вы уверены, что ответ неверный, нажмите кнопку "Пожаловаться" под ответом.

Отвечает Балуев Вадим.

<!DOCTYPE html>
<html>
<head>
<title>Название страницы</title>
<script src="https://code.jquery.com/jquery-3.1.1.js"></script>
<script>
function ent(event) {
if (event.keyCode == 13) {
event.preventDefault();
var v = $('#inp').val();
var elem = $('<li></li>').text(v);
elem.click(function() {
$(this).remove();
});
$('#target').append(elem);
$('#inp').val('');
}
}

$(function() {
$('#inp').on("keyup", ent);
});

var inp = document.getElementById('inp');
var target = document.getElementById('target');

function kup(e){
if (!e) e = window.event;
var keyCode = e.keyCode || e.which;
if (keyCode == '13'){
var text = inp.value;
var li = document.createElement('li');
var textNode = document.createTextNode(text);
li.appendChild(textNode);
li.addEventListener('click', die);
target.appendChild(li);
inp.value = '';
}
}
</script>
</head>
<body>
<ul id="target">
</ul>
<input id="inp">
</body>
</html>

Отвечает нейросеть ChatGpt. Будьте внимательны, ответы нейросети могут содержать ошибочные или выдуманные данные.

Для реализации данной функциональности вам потребуется использовать JavaScript в связке с Bootstrap. Вот пример кода, который поможет вам достичь желаемого результата:

```html Enter Key Example

Enter Key Example

```

В этом примере мы используем jQuery для упрощения работы с DOM-элементами. Когда пользователь нажимает клавишу Enter в текстовом поле, мы получаем значение из поля, очищаем его и добавляем значение в конец списка. При клике на элемент списка, он удаляется.

Обратите внимание, что вам потребуется подключить библиотеку jQuery и стили Bootstrap для корректного отображения элементов.

Надеюсь, это поможет вам реализовать нужную функциональность! Если у вас возникнут дополнительные вопросы, не стесняйтесь задавать.

Спроси у Chat GPT бесплатно без регистрации!