按下回车键时,将连字符添加到textarea

时间:2014-11-11 08:42:23

标签: javascript jquery html forms textarea

所以我想把连字符放在textarea的每一个新行上。我怎样才能做到这一点?我基本上希望它看起来像这样:

 - One
 - Two
 ...

使用jQuery的东西可能,但我不知道是什么..

3 个答案:

答案 0 :(得分:1)

您可以使用jQuery Entey键捕获事件来执行此操作。小提琴下面会帮助你。

http://jsfiddle.net/kiranvarthi/666ausss/

更新小提琴:http://jsfiddle.net/kiranvarthi/666ausss/1/

$('#textbox').keypress(function(event){
    var keycode = (event.keyCode ? event.keyCode : event.which);
    if(keycode == '13'){
        alert('You pressed a "enter" key in textbox');  
        document.getElementById('textbox').value = document.getElementById('textbox').value + "\n-";
    }
    event.stopPropagation();
});

答案 1 :(得分:1)

试试这个。我认为这更好

$('#textbox').keypress(function(event){
 
	var keycode = (event.keyCode ? event.keyCode : event.which);
	if(keycode == '13'){
		//alert('You pressed a "enter" key in textbox');	
      
        var cursorPos = $('#textbox').prop('selectionStart');
            var v = $('#textbox').val();
            var textBefore = v.substring(0,  cursorPos );
            var textAfter  = v.substring( cursorPos, v.length );
            $('#textbox').val( textBefore+ "\n-" +textAfter );
        
        
        setCaretPosition(document.getElementById('textbox'),( cursorPos + 2));
        
        return false;
        
	}
	event.stopPropagation();
});

 function setCaretPosition(ctrl, pos){
	if(ctrl.setSelectionRange)
	{
		ctrl.focus();
		ctrl.setSelectionRange(pos,pos);
	}
	else if (ctrl.createTextRange) {
		var range = ctrl.createTextRange();
		range.collapse(true);
		range.moveEnd('character', pos);
		range.moveStart('character', pos);
		range.select();
	}
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>
<textarea id="textbox"></textarea>

答案 2 :(得分:0)

请添加此脚本。它会起作用。

<script>
document.getElementById('myTextarea').onkeyup = function(e) {

if (e.keyCode == 13){
  var x = document.getElementById("myTextarea").value;
  document.getElementById("myTextarea").value = x+'-';
    return false;
 }
}
</script>
相关问题