jQuery:修改textarea

时间:2018-05-01 11:02:11

标签: javascript jquery html

我想将target="_blank"添加到textarea中的某些“A”标记。当它们不在textarea中时我可以修改它们但是当它们在textarea中时我不能这样做。

对于这段代码,我只想在它是外部链接时添加目标属性。 jsFiddle link

<form>
<textarea id="description">
<a href="https://www.website.com/">internal</a>
<a href="https://www.google.com/">external no target</a>
<a href="https://www.google.com/" target="_blank">external target</a>
<a href="https://www.google.com/">external no target</a>
<a href="https://website.com/">internal</a>
<a href="https://www.google.com/">external no target</a>
</textarea>
<button class="btn btn-success">Go</button>

</form>

<a href="https://www.google.com/">external no target</a>

我尝试了几种不同的方法来指定链接在textarea中但没有工作。这是我试过的一个版本......

// This does not work...
$('#description a:not([target])').not('a[href*=website]').attr('target', '_blank');

// This works for the link 
$('a:not([target])').not('a[href*=website]').attr('target', '_blank');

任何帮助非常感谢。感谢。

2 个答案:

答案 0 :(得分:2)

您放入<textarea>标记内的任何内容都会以纯文本形式显示其值。 这意味着它们不再是HTML元素,因此无法使用jQuery进行选择。

Textareas用于用户输入,将任何内容放入其中的唯一原因是作为默认值。 你为什么要在里面有链接?

答案 1 :(得分:2)

由于它们是文本而非实际元素,因此您需要操作字符串。

一种简单的方法是将字符串作为html放入临时元素中,对该元素运行dom方法并返回更新后的html

类似的东西:

$('#description').val(function(_,currVal){
    var $div = $('<div>').append(currVal);
     $div.find('a:not([target])').not('a[href*=website]').attr('target', '_blank');
    return $div.html()
})