Question

这些功能的基础知识有效，但是对于每个点击的取消按钮，下一个按钮都会为其添加该点击次数。例如，如果用户单击取消按钮一次，则下次单击具有不同ID的其他按钮时，firebug会显示包含表单（page2）的页面以加载多次，而不是一次。这一切都是动态生成的，因此父页面上最多可能有10个这样的div。应该发生的是：

用户点击父页面上的只读文本框
onfocus会清空父页面中的div并加载子页面 3.子页面中的表格现在位于readonly的文本框空间
用户提交评论或取消
任一操作都应将readonly文本框放回页面中（到目前为止，这一切都有效）
当按下另一个div以留下评论时，该页面只应加载一次，而不是单击前一个按钮的次数。

在第一页我有：

<head>
    <script type="text/javascript">
        $(document).ready(function(){
            var ajaxInProgress = false;
            $(function(){
                if (ajaxInProgress) return;
                $('.ce').focus(function(){
                    var cid = this.id;
                    $('#comfield'+cid).empty();
                    $('#comfield'+cid).load('content_comment.php?id=<%=intmemberid%>&cid=' + cid);
                });
            });
    </script>
</head>
<body>

    <div id="comform"
        <div id="comfield2">
            <input class="ce" id="2" type="text" value="Write a comment..." readonly="readonly" />
        </div>
    </div>
    <div id="comdata2"></div>

    <div id="comform"
        <div id="comfield3">
            <input class="ce" id="3" type="text" value="Write a comment..." readonly="readonly" />
        </div>
    </div>
    <div id="comdata3"></div>

</body>

在第2页我有

<script type="text/javascript">
    $(document).ready(function() {

        document.commentform2.comment.focus();

        $("#cancelcomment2").click(function(){
            $('#comfield2').empty();
            $('#comfield2').html('<input class="ce" id="2" type="text" value="Write a comment..." readonly="readonly" />');
            var ajaxInProgress = false;
            $(function(){
                $('.ce').focus(function(){
                    if (ajaxInProgress) return;
                    var cid = this.id;
                    $('#comfield'+cid).empty();
                    $('#comfield'+cid).load('content_comment.php?id=55&cid=' + cid);
                });
            });
        });

        $("#submitcomment").click(function(){
            $('#formcomment').ajaxForm(function (data, textStatus){
                $('#formcomment').clearForm();
                $('#comfield2').empty();
                $('#comfield2').html('<input class="ce" id="2" type="text" value="Write a comment..." readonly="readonly" />');
                $('#comdata2').append(data).fadeIn(700);
                var ajaxInProgress = false;
                $(function(){
                    if (ajaxInProgress) return;
                    $('.ce').focus(function(){
                        var cid = this.id;
                        $('#comfield'+cid).empty();
                        $('#comfield'+cid).load('content_comment.php?id=55&cid=' + cid);
                    });
                });
            });
        });

    });
</script>

<form id="formcomment">
    <textarea id="commenttext2>" name="comment" class="commentarea"></textarea>
    <input type="submit" id="submitcomment" value="comment />
    <button id="cancelcomment2">Cancel</button>
</form>

Answer 1

这可能不是“最佳”方式，但它会起作用。

替换所有出现的

$('.ce').focus(function(){

带

$('.ce').unbind("focus").focus(function(){

在两个剧本中。

更好的方法是事件委托，但这会对代码进行更多更改。

需要JQuery停止重复点击的每个按钮

1 个答案: