要实现将文本框<textarea>中的[img]图片地址[/img]转换为可视化的 <img> 标签以显示图片，可以使用 JavaScript 来监听文本框内容的变化，并在发生变化时进行转换和更新显示。
<!DOCTYPE html>
<html>
<head>
<title>实时转换图片标签</title>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
</head>
<body>
<textarea id="content" rows="4" cols="50"></textarea>
<div id="preview"></div>
<script>
$(document).ready(function() {
var textarea = $('#content');
var preview = $('#preview');
textarea.on('input', function() {
var content = textarea.val();
var replacedContent = content.replace(/\[img\](.*?)\[\/img\]/g, '<img src="$1">');
preview.html(replacedContent);
});
});
</script>
</body>
</html>
在上述示例中，我们使用了 jQuery 来监听 <textarea> 的输入事件 input，并获取文本框中的内容。然后，使用正则表达式将 [img]图片地址[/img] 替换为 <img src="图片地址">，并将结果更新到一个 <div> 容器中以实时显示转换后的内容。