我为文本区域创建了一个工具栏,我想要做的是在单击工具栏按钮时保持焦点。
我的HTML代码:
<div id='toolBar'>
<button id="btnItalic" class="btn btn-primary" aria-label="Italic">
<span class="glyphicon glyphicon-italic" aria-hidden="true"></span>
</button>
</div>
<textarea class="form-control postMessage" id="forumSubject-content" name="forumSubject-content" placeholder="Tapez votre message"></textarea>
我的css代码:
#toolBar{
top: 5px;
position: absolute;
z-index: 5;
left: 30px;
display: none;
height: 30px
}
#toolBar button{
padding: 5px;
height: 25px;
width: 25px;
}
我的js(我使用流星但我接受所有答案):
'click #forumSubject-content': function(e, t) {
$('#toolBar').show();
},
'blur #forumSubject-content': function(e, t) {
$('#toolBar').hide();
},
'click #btnItalic': function(e, t){
e.preventDefault();
$('#toolBar').show();
var cursorPos = $('#forumSubject-content').prop('selectionStart');
var cursorPos2 = $('#forumSubject-content').prop('selectionEnd');
var v = $('#forumSubject-content').val();
var textBefore = v.substring(0, cursorPos );
var textMiddle = v.substring(cursorPos, cursorPos2 );
var textAfter = v.substring( cursorPos2, v.length );
$('#forumSubject-content').val( textBefore+ "*" + textMiddle + '*' +textAfter );
return false;
}
提前感谢!