从textarea追加价值

时间:2015-08-19 19:20:10

标签: javascript jquery append

我是Jquery / javascript的初学者。我试图将textarea的值附加到div。但是当我用jquery执行此操作时它会附加(我想)但只显示变量名。为什么会发生?

Codepen

$(document).ready(function() {
 $('#textbox').click(function(event) {
 	if(event.which=13) {
    if($('#enter').prop("checked")) {

      $('#textbox').val('');
      event.preventDefault();

    }		
 	}
  $('#send').click(function() {

    var userMessage = $('#textbox').val();
    $('#textbox').val('');
    $('#container').append("userMessage");

  });
 
 });
});
* {
  	padding:0;
  	margin:0;
  }
  body {
  	background:#eee;
  }
 #container {
 	width:600px;
 	height:500px;
    background:#fff;
    border:1px solid black;
    margin:0 auto;
 }
 #controls {
 	margin:0 auto;
 	width:600px;
}
 #textbox {
 	resize:none;
 	width:540px;
 	}
 #send {
 	width:50px;
 	height:30px;
 	margin-top: 0px;
  position:absolute;
 }
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="container"></div>
<div id="controls">
<textarea id="textbox" placeholder="Enter your message here!"></textarea>
<button id="send">Send</button><br>
<input type="checkbox" id="enter"><br>
<label for="enter">Send on enter</label>
</div>

2 个答案:

答案 0 :(得分:0)

关闭 - userMessage周围没有引号,因此代替使用append("userMessage")代替:

$('#container').append(userMessage);

http://codepen.io/anon/pen/NqZGrm

答案 1 :(得分:0)

$(document).ready(function() {
  $('#textbox').keydown(function(event) {
    if(event.which==13 && $('#enter').prop("checked")==true) {
      $('#container').append("<br/>"+$('#textbox').val());
      $('#textbox').val('');
      event.preventDefault();
     }
  });

  $('#send').click(function() {
     var userMessage = $('#textbox').val();
     $('#textbox').val('');
     $('#container').append("<br/>"+userMessage);
  });

});