jquery - 如何从输入接收数据到div

Question

我想将数据显示给 div 而不是 textarea 怎么做..

<script type='text/javascript'>
$(window).load(function () {
    $("#pasteable").bind('paste', function (event) {
        var $pastable = $(this);
        setTimeout(function () {
            $("#target").val($pastable.val());
            $pastable.val("");
            $pastable.focus();
        }, 100);
    });

});
</script>

粘贴到这里：<input id="pasteable" />

它应该在这里显示：

<textarea id="target"></textarea>  

如何在这个 div 中显示

 <div id="target"contentEditable="true"style="width:300px;height:100px;border:1px #ffccff solid"></div>

Answer 1

工作 jsFiddle 演示

您的#target元素textarea不再存在，因此您必须使用.html()方法而不是.val()方法。考虑以下标记：

<input id="pasteable" />
<div id="target"contentEditable="true"style="width:300px;height:100px;border:1px #ffccff solid"></div>

在你的 JS 代码中：

$(function () {
    $("#pasteable").bind('paste', function (event) {
        var $pastable = $(this);
        setTimeout(function () {
            $("#target").html($pastable.val());
            $pastable.val("");
            $pastable.focus();
        }, 100);
    });
});

Answer 2

页面上不能有 2 个相同id的元素。相应地更改其中之一，例如：

<textarea id="source"></textarea>  

和：

<div id="target" contentEditable="true" style="width:300px;height:100px;border:1px #ffccff solid"></div>

Answer 3

永远不要在form. 但是，如果您有一些要求，请使用 as-

  $(window).load(function () {
    $("#pasteable").bind('paste', function (event) {
    var $pastable = $(this);
    setTimeout(function () {
        $("[id='target']").val($pastable.val());
        $pastable.val("");
        $pastable.focus();
    }, 100);
  });

});