Отправка сообщения по нажатию Enter
Всем привет! Есть такая задача: нужно чтобы текст в теге textarea отправлялся по нажатию клавиши Enter или комбинацией ctrl+enter. Как такое реализовать? Вот код:
<!DOCTYPE html> <html> <head> <title>jQuery</title> <meta charset="utf-8" /> <script type="text/javascript" src="jquery-3.1.0.min.js"></script>
<script type="text/javascript">
$(document).ready(function () {
$(document).on("click", "input[name='addbitch']", function() {
var comment = $("textarea[name='textcommenta']").val();
$("<p>-" + comment + "</p>").appendTo("#comments");
document.getElementById('addbitch').value='';
});
});
$(document).ready(function() {
$("input[name='deletebitch']").bind("click", function() {
$("#comments").empty();
});
});
</script>
</head>
<body vlink="blue">
<div id="comments"></div>
<form name="mycomment" action="#" method="post">
<textarea name="textcommenta" cols="40" rows="10" value="" id="addbitch"></textarea>
<br/>
<input type="button" name="addbitch" value="Отправить" />
<input type="button" name="deletebitch" value="Удалить комментарии" />
</form>
</body>
</html>
|
<input type="submit" name="addbitch" value="Отправить" /> - отправит форму и по Enter.
$(document).ready(function() - зачем же для каждой установки обработчика прописывать? |
Пробовал submit, вообще перестала функция работать, а обработчик пишу, чтобы html с js не пересекались, это как бы неправильно.
|
По enter только однострочные поля уходят, ибо переносить там все равно нельзя, а текстареа - только по контроль-ентер, поскольку альт-ентер традиционно задействован для мягкого переноса.
В чем проблема код клавиш заюзать? Там все эти контроли с альтами и ентерами есть.
function keycheck(e){
if (e.ctrlKey && e.keyCode == 13) {
send();
}
};
textarea.addEventListener('keyup',keycheck);
|
Цитата:
|
Ну а где у тебя отправка мессаги на сервер?
|
А, ты хочешь так форму грузить, по сабмиту, без перделок, пнл.
Тогде вместо send() напиши this.form.submit(); |
<!DOCTYPE html>
<html>
<head>
<title>jQuery</title>
<meta charset="utf-8" />
<script type="text/javascript" src="https://code.jquery.com/jquery-3.1.0.min.js"></script>
<script type="text/javascript">
$(document).ready(function () {
$("input[name='addbitch']").on("click", function() {
var comment = $("textarea[name='textcommenta']").val();
$("<p>-" + comment + "</p>").appendTo("#comments");
$('#addbitch').val('');
});
$("input[name='deletebitch']").bind("click", function() {
$("#comments").empty();
});
$("#addbitch").on("keyup", function(e) {
if (e.ctrlKey && e.keyCode == 13) {
$("input[name='addbitch']").trigger( "click" );
}
});
});
</script>
</head>
<body vlink="blue">
<div id="comments"></div>
<form name="mycomment" action="#" method="post">
<textarea name="textcommenta" cols="40" rows="10" value="" id="addbitch"></textarea>
<br/>
<input type="button" name="addbitch" value="Отправить" />
<input type="button" name="deletebitch" value="Удалить комментарии" />
</form>
</body>
</html>
|
Кстати
Цитата:
Специально для оленеводов предусмотрена кнопка reset. <input type="reset" value="Удалить комментарии"/> и ничего больше не надо. Более того, reset не стирает данные, а возвращает defaultValue на место. Если value="" то сотрет, а если было прописано value="лесной олень", то вернет лесного оленя. И напоследок, если уж не хочется рисовать reset, то вызывай одноименный метод формы после нажатия любой хтмл кнопки form.reset() и всё. |
Цитата:
|
| Часовой пояс GMT +3, время: 02:26. |