每当我按下输入框内的键盘输入按钮(其中有文本)时,都会出现新的段落

New paragraph each time I press keyboard enter button inside my inputbox (in which there is text)

本文关键字:输入 文本 段落 按钮 键盘      更新时间:2023-09-26

每次在输入框内按enter键(在键盘上),并且输入框内有文本时,我都希望出现包含输入框中文本的新段落。

这是我的尝试,我的代码出了什么问题?它不起作用:

https://jsfiddle.net/dxuax025/

HTML:

<input type="text" id="text">
<div id="list"></div>

jQuery:

$(document).ready(function() {
                var r = $('<p>' + a.val() + '<p>');
        $('#text').keypress(function(e) {
            if(e.which == 13 & a.val() !== "") {
                var a = $('#text');
                var html = r(a.val());
                $('#list').append(html);
                $(a).val("");}
                return false;
            });
        }); 

逻辑为:

  1. 检测ENTER键
  2. 如果用户按下ENTER键,则从输入中获取值
  3. 最后,将p标记附加到div

$(document).ready(function() {
	  $('#text').keypress(function(e) {
	    var key = e.which;
	    if (key == 13) // the enter key code
	    {
	      var inputText = $("#text").val();
	      $("#list").append("<p>" + inputText + "</p>");
          $("#text").val("");
	    }
	  });
	});
#list p {
  background: rgba(255, 255, 255, 0.95);
  box-shadow: 0 2px 2px rgba(0, 0, 0, .15);
  color: #473e39;
  font-size: 16px;
  margin: 0 auto 5px;
  padding: 20px;
  max-width: 520px;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" id="text" placeholder="Input something and enter">
<div id="list"></div>