Question

我有一个带有一些复选框的html页面：

<div class="col-md-2">
        <div class='form-group employe-admin-contactP'>
            <input type="checkbox" class="readymade-checkbox admin" name="" id="admin-${member?.user?.id }" data-id="${member?.user?.id }"
                <g:if test="${member?.isAdmin()}">
                    checked
                </g:if>
            />
            <label for="admin-${member?.user?.id }" name="" class="readymade-label admin"></label>
        </div>
    </div>

每次用户点击复选框（选中/取消选中）时，都必须触发我在js文件中写入的以下功能：

$(document).ready(function() {
    $('.readymade-checkbox.admin:not(checked)').on('click',function(){
        var contact = {id:$(this).data('id') }
        $.ajax({
            url: makeUserAdmin,
            type: "post",
            data: {
                id: JSON.stringify(contact), companyId: $('#teamCompanyId').val()
            },
            success: function (data, textStatus) {
                jQuery("#updateCompanyteam").html(data);
            }
        })
        return false;
    });
})

问题是这个功能只被触发一次。

Answer 1

我敢打赌，jQuery("#updateCompanyteam").html(data);会修改复选框的HTML区域＆＃34; .readymade-checkbox.admin＆＃34;。您需要为您的click事件提供持久监听器（即使修改了DOM也可以使用），或者刷新您的监听器。此问题已在多个线程中得到解决，例如this one。

干杯

仅在第一次上单击事件触发器而不是每次

1 个答案: