-3

私はJqueryを初めて使用し、コンテンツ編集可能なdivのキーダウンイベントが複製されない理由を解決しようとしています。clone(true) を発見したとき、問題は解決したと思いましたが、コードがまだ機能していません。以下のコードは、私が達成しようとしているものの単純化されたバージョンです。

基本的に、キーダウン イベントをコンテンツの編集可能な div にアタッチしてから複製しています。ただし、複製された div は元の div のようには機能しません。

私はしばらくの間解決策を探していましたが、先に進むことができるように誰かが私に答えてくれることを願っていました-どうもありがとう。

<!DOCTYPE HTML>
<html>
<head>
<meta charset="UTF-8">
<title>untitled</title>

<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script type="text/javascript">


$(document).ready(function() {

    var mymax1 = 10;

    $('#List_1').keydown(function(e){ check_charcount(mymax1, e); });

    function check_charcount(mymax1, e)
    {   
        <!--prevent line breaks, that is the enter key from working-->
        if(e.keyCode==13){
        e.preventDefault();
        }

        if(e.which != 8 && $('#List_1').text().length > mymax1{
            $("#List_1").css("background-color","yellow"); 

            e.preventDefault();
        }
    }

    <!---->
    var $cloned = $('#hope').clone(true);

    $('#placeHere').append($cloned.html());
    });

</script>

</head>
<body>

<div id="hope">
<div id="List_1"  contentEditable="true">TEXT</div>
</div>

</br>
<div id="placeHere"></div>
</body>
</html>
4

1 に答える 1

1

指摘されたIanのように、コードの一部が正しくありませんでした。使用しているキーダウン関数では$('list_1')、要素への参照を使用する必要があります。ところで、clone keep id attr は、複製された要素が元の要素と同じ id を取得することを意味しますが、これは有効ではありません。作業コードを参照してください：

$(document).ready(function () {

    var mymax1 = 10;

    $('#List_1').keydown(function (e) {
        check_charcount(mymax1, e);
    });

    function check_charcount(mymax, e) {

        if (e.keyCode == 13) {
            e.preventDefault();
        }

        if (e.which != 8 && $(e.target).text().length > mymax) {
            $(e.target).css("background-color", "yellow");

            e.preventDefault();
        }
    }


    var $cloned = $('#hope').clone(true);

    $('#placeHere').append($cloned.contents().removeAttr('id'));
});

デモを見る

于 2013-04-08T16:01:41.197 に答える