我已经为textarea应用了enscroll插件:
$('textarea[name="text_area_name"]').enscroll({
showOnHover: true,
scrollIncrement: 20,
minScrollbarLength: 25,
verticalTrackClass: 'track3',
verticalHandleClass: 'handle3'
});
现在问题是空间和光标位置(左,上,右,下箭头)不适用于那个textarea。对于间距,我已经应用了以下代码,并且它在写入文本区域时可以完美地添加间距:
$('#text_area_name').keydown(function(e) {
var event = e.which || e.keyCode;
// Handle Space button
if (event === 32) {
var data = $(this).val();
data += " ";
$(this).val(data);
}
});
CSS
textarea{
width: 190px !important;
height: 50px;
resize: none;
margin: 10px 0 0 0;
border-radius: 5px;
box-shadow: none;
padding:10px;
background-color: #EAEAEA;
}
但我不知道如何应用箭头键码并改变光标的位置。谁能指导我实现这一目标?
UPDATE:我注意到当我点击textarea并按向上和向下键时,动态生成的滚动会移动,然后我认为在enscroll插件中存在问题,但我不确定。
答案 0 :(得分:0)
我不知道它是是对还是不但是我已经改变了核心enscroll插件的部分,它对我有用:
keyHandler = function( event ) {
var $this = $( this ),
data = $this.data( 'enscroll' ),
scrollIncrement;
// don't handle events that have just bubbled up
if ( event.target === this && data ) {
scrollIncrement = data.settings.scrollIncrement;
switch( event.keyCode ) {
/*case 32: // space*/
case 34: // page down
scrollVertical( this, $this.height() );
return false;
case 33: // page up
scrollVertical( this, -$this.height() );
return false;
case 35: // end
scrollVertical( this, this.scrollHeight );
return false;
case 36: // home
scrollVertical( this, -this.scrollHeight );
return false;
/*case 37: // left
scrollHorizontal( this, -scrollIncrement );
return false;
case 38: // up
scrollVertical( this, -scrollIncrement );
return false;
case 39: // right
scrollHorizontal( this, scrollIncrement );
return false;
case 40: // down
scrollVertical( this, scrollIncrement );
return false;
*/
}
return true;
}
}
这是处理我所挣扎的所有键的功能(空格 - > 32和37到40方向键),我只是禁用相关的键。