I'd like to make an Insert Link
button. Here is what I came up with:
$(document).ready(function(){
function HyperLink(elementID, openTag, closeTag) {
var textArea = $('#' + elementID);
var len = textArea.val().length;
var start = textArea[0].selectionStart;
var end = textArea[0].selectionEnd;
var selectedText = textArea.val().substring(start, end);
var replacement = openTag + selectedText + closeTag;
textArea.val(textArea.val().substring(0, start) + replacement + textArea.val().substring(end, len));
}
$('#btnHyperlink').click(function() {
HyperLink("id_description", "<a>", "</a>");
});
});
The snippent above embraces text with <a>...</a>
, however I don't know how to insert href to the text.
Appreciate your help.
Note:
I want links to be dynamically added to the text, as this button is going to be used in a simple text editor.
You can try like this:
$('#id_description').html('<a href="http://www.google.com">Google</a>');
Not sure if this is what you are looking for but here it goes:
var field = "http://www.google.com"
$(document).ready(function () {
$('.id_description').each(function () {
this.innerHTML += ' <a href=" ' +field + '">Google</a>';
});
});
Then how about:
$('#btnHyperlink').click(function() {
var href = prompt("Insert url");
if(href != "" && href != null)
{
HyperLink("id_description", href);
}
});
And the function:
function HyperLink(elementID, url) {
var textArea = $('#' + elementID);
var len = textArea.val().length;
var start = textArea[0].selectionStart;
var end = textArea[0].selectionEnd;
var selectedText = textArea.val().substring(start, end);
var replacement = $('<div/>').append(
$('<a/>').attr('href', url).html(selectedText)
).html();
textArea.val(textArea.val().substring(0, start) + replacement + textArea.val().substring(end, len));
}
EDIT
Seems that concatenating an a
tag into a string gives just the url, so I wrapped it into a div and extracted its content to output it as a string.
EDIT 2 Seems that I copied a wrong version of the code. Sorry. Here's the JSFiddle:
You can give something a href
by doing this in JavaScript:
element.href = "url";
In jQuery you can use:
element.attr('href', 'url');
尝试使用jQuery wrap()
$( "#id_description" ).wrap( '<a href="path"></a>' );
try:
<span class="linkable">Click to insert link</span>
$('.linkable').click(function(){
var text = $(this).html();
var link = $("<a>", {
href: "http://google.com"
}).html(text);
$(this).replaceWith(link);
});
$("textarea").on("select", function(){
var start = this.selectionStart;
var end = this.selectionEnd;
var text = this.innerHTML.substring(start, end);
var link = $("#user_link").val();
var new_link ="<a href='"+link+"' target='_blank'>"+text+"</a>";
$(this).after(new_link);
});
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.