Question

好的，我们正在创建一个unicode表单，基本上用户点击一个按钮（href链接），我希望发送并发布到textarea中的值。

链接就像这样

<a href="javascript:;" class="button" title="type - lol">&#x263b</a>

像这样的textarea：

<textarea id="text-to-copy" cols="48" id="textarea" rows="5" onfocus="if(this.value=='type your text here ...')this.value='';" onblur="if(this.value=='')this.value='type your text here ...';">type your text here ...</textarea>

请任何想法。

请注意我们有多个href，用户可以点击发布到textarea。

例如

    <a href="javascript:;" class="button" title="type - heart or love">&#x2665</a>
<a href="javascript:;" class="button" title="type - club">&#x2663</a>
<a href="javascript:;" class="button" title="type - lol">&#x263b</a>

Answer 1

如果我错了，请纠正我。但如果这就是你想要的，那么删除textarea并使用div元素。并使用javascript的appendChild方法追加其textContent将承担锚点值的span元素。

要使div元素的行为类似于文本区域，请使用contentEditable属性并将max-width和max-height设置为它。

Answer 2

$('.button').click(function(event) {
    event.preventDefault();
   $("#text-to-copy").text($(this).html());
});

这会将textarea中的文本设置为a

中的文本

http://jsfiddle.net/manseuk/BHCdJ/1/

或追加：

$('.button').click(function(event) {
    event.preventDefault();
    if ($("#text-to-copy").text() == "type your text here ...") {
        $("#text-to-copy").text($(this).html());
    } else {
        $("#text-to-copy").text($("#text-to-copy").text() + $(this).html());
    }
});

http://jsfiddle.net/manseuk/BHCdJ/2/

Answer 3

尝试使用此功能。我喜欢用jQuery来完成这样的任务。它将清除textarea案例，它具有默认文本，然后附加内容。

<a href="javascript:;" onclick="addEmoticon(this)" class="button" title="type - lol">&#x263b</a>

<script type="text/javascript">
function addEmoticon(el){
if (document.getElementById('text-to-copy').value == 'type your text here ...'){
    document.getElementById('text-to-copy').value = '';
}
document.getElementById('text-to-copy').value += el.innerHTML
}
</script>

onclick将此值发布到textarea

3 个答案: