我有这个 Js 模块,我在其中通过单击将标签添加到 Textarea。你可以在我的DEMO中看到
现在的问题是当我添加 tag 时,它会从 Textarea 失去焦点,
例如,现在我点击标签,然后开始输入,它不会输入,因为我的光标不会出现在 textarea 中。
我想要的是,当我添加标签时,光标或焦点应该保留在 textarea 中,这样我就不必单击 textarea 来输入。
这是我的小提琴
简单点击标签并继续输入,你会得到我的问题
我也在这里证明我的代码:JS:
$('.tags').click(function (){
var caretPos = document.getElementById("template_message").selectionStart;
var textAreaTxt = $("#template_message").val();
var txtToAdd = $(this).attr("id");
$("#template_message").val(textAreaTxt.substring(0, caretPos) + txtToAdd + textAreaTxt.substring(caretPos) );
});
HTML:
<div class="tags_container">
<div> <strong> Add Tags: </strong><br /></div>
<li><a href="javascript:void(0);" class="tags" id="[OfferID]"><span >{Offer ID}</span></a></li>
<li><a href="javascript:void(0);" class="tags" id="[Username]"><span >{Username}</span></a></li>
<li><a href="javascript:void(0);" class="tags" id="[LoadingDate]"><span >{Loading Date}</span></a></li>
<li><a href="javascript:void(0);" class="tags" id="[DeliveryDate]"><span >{Delivery Date}</span></a></li>
</div>
<p>
<textarea style="width:400px;height:100px" name="template_message" class="Required textfield" cols="40" rows="" id="template_message"></textarea>
</p>
注意:我不想在末尾聚焦,我希望在我添加的标签之后聚焦,这样我就可以在同一个地方添加多个标签