Question

我在使用Jquery将事件侦听器绑定到动态创建的TextArea控件时遇到了一些麻烦。

这是我的情景。

我需要为最终用户提供在点击添加按钮时创建TextArea控件的功能。我还需要使用Autosize功能。我浏览了网页（现在）决定使用Jtextarea.js插件（http://www.jscripts.info/jtextarea.php）来实现自动调整功能。到目前为止，我能够动态地动态创建textareas，但很难让它们自动化。

我是否可以获得有关如何实现此目的的一些信息。

感谢。

<html>
    <head>
        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>
        <script src="jtextarea.js" type="text/javascript"></script>
        <script type="text/javascript">
            $(document).ready(function () {
                $('.textarea').jtextarea();
                $(document).on('', '.textarea', function (e) {
                    $('.textarea').jtextarea();
                });
            });

            function addBullet() {
                $('#myOrderedList').append('<li><textarea class="textarea"></textarea><a href="javascript:;" class="itemDelete">(x)</a></li>');
                // alert("button clicked");
            }

            $($(document)).on('click', '.itemDelete', function () {
                $(this).parent().remove();
                //alert("x clicked");
            });
        </script>
        <style>
            textarea {
                height: 20px;
                width: 300px;
            }

            #myOrderedList {
                list-style: decimal-leading-zero;
            }

            li textarea {
                vertical-align: top;
            }
        </style>
    </head>
    <body>
        <ul id="myOrderedList">
            <li><textarea class="textarea"></textarea></li>
        </ul>
        <button onclick="addBullet()">Add</button>
    </body>
</html>

Answer 1

看起来您选择的脚本存在一些问题（请参阅您提供的链接的评论和问题部分）。我建议例如：http://www.jacklmoore.com/autosize/ 他们的榜样有效。

您还需要清理（重写）您的java脚本代码，例如您正在初始化jtextarea()两次。

EventBinding用于动态添加TextArea

1 个答案: