我正在尝试在textarea中标记字符串/文本,然后将其包装在自定义标签周围。
现在,我可以轻松获得突出显示的文本,并且可以将其包装在标签周围并用alert()对其进行包装,但是我无法在文本区域内替换它。
这是我的工作FIDDLE(https://jsfiddle.net/dftLu6ax/)
这是我的Javascript / jQuery代码:
$('#showSelected').on('click', function(){
function getInputSelection(elem){
if(typeof elem != "undefined"){
s=elem[0].selectionStart;
e=elem[0].selectionEnd;
return elem.val().substring(s, e);
}else{
return '';
}
}
var text = getInputSelection($("#details"));
var link = prompt("Please enter your URL", "");
if (link != null) {
var str = document.getElementById("details").value;
var res = str.replace(text, "<a onclick='somevariable goes here' href=''>"+text+"</a>");
alert(res);
/*document.getElementById("demo").innerHTML =
"Hello " + person + "! How are you today?";*/
}
});
和我的简单HTML:
<input type="button" id="showSelected" value="Insert Link">
<textarea class="form-control" rows="5" id="details" name="details"></textarea>
有人可以为此提供建议吗?
提前致谢。
最佳答案
因为您可以通过以下方式在文本区域内获取文本:
document.getElementById("details").value
您可以使用相同的值来设置更新的值:
function getInputSelection(elem){
if(typeof elem != "undefined"){
s=elem[0].selectionStart;
e=elem[0].selectionEnd;
return elem.val().substring(s, e);
}else{
return '';
}
}
$(function () {
$('#showSelected').on('click', function(){
var text = getInputSelection($("#details"));
var link = prompt("Please enter your URL", "");
if (link != null) {
var str = document.getElementById("details").value;
var res = str.replace(text, "<a onclick='somevariable goes here' href=''>"+text+"</a>");
//THIS LINE
document.getElementById("details").value = res;
}
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="button" id="showSelected" value="Insert Link">
<textarea class="form-control" rows="5" id="details" name="details"></textarea>