如何使用jQuery替换textarea内部属性的内容？

Question

I have this code:

<textarea class="mapCode">
<    area shape="rect" coords="" href="http://www.sitehere" target="_self">
</textarea>

How can I use jQuery to insert/update values into the coords attribute even if it's not empty?

Right now I'm using...

return $(this).text().replace("coords=\"\"", 'coords="'+selection.x1+','+selection.y1+','+selection.x2+','+selection.y2+'"');

But of course that only works one time since it's always looking for an empty coords="" attribute.

Answer 1

You should use a regular expression with a wildcard in your replace call:

$(this).text().replace(/coords=".*"/gi, 'coords="..."');

This will work with both an empty and a set coords attribute.

Answer 2

You can wrap textarea content in a jQuery object then use any relevant method to update it, eg:

var $content = $('<div/>').html($('.mapCode').val());
$content.find('area').attr('coords', selection.x1+','+selection.y1+','+selection.x2+','+selection.y2);

$('.mapCode').val($content.html());

-DEMO-

Answer 3

<textarea class="mapCode">
   <area id="myArea" shape="rect" coords="" href="http://www.sitehere" target="_self">
</textarea>

JavaScript:

$(function () {
    var myArea = $('#myArea');
    myArea.attr('coords', selection.x1+','+selection.y1+','+selection.x2+','+selection.y2);

});​