启用“条款与条件”上的复选框;下拉不工作

Enable the checkbox on "Terms and conditions" scrolldown not working

本文关键字：复选框 工作 条款与条件 条件 启用      更新时间：2023-09-26

我的复选框一开始是选中的，即使应该设置为false。复选框在滚动时被选中，不经过if语句。

https://jsfiddle.net/7mujuvn3/1/ 

$(document).ready(function () {
    //checkbox
    $('#box').attr('checked', 'false');
        $("#terms").scroll(function () {
            //the room for scrolling is 30px in the textarea
            if ($("#terms").scrollTop() === 30) {
                $('#box').attr('checked', 'true');
            } else {
                $('#box').attr('checked', 'false');
            }
        });
    });

您应该删除true和false周围的引号，在所有情况下使用prop，并在scrollTop之后使用括号将其作为方法运行。此外，您可能希望使用>来检查scrollTop，因为如果它大于或小于30，它将再次取消选中该框。

https://jsfiddle.net/7mujuvn3/4/

$(document).ready(function () {
    //checkbox
    $('#box').prop('checked', false);
    $("#terms").scroll(function () {
        //the room for scrolling is 30px in the textarea
        if ($("#terms").scrollTop() > 30) {
            $('#box').prop('checked', true);
        } else {
            $('#box').prop('checked', false);
        }
    });
});
#terms {
    width: 300px;
    height: 180px;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<textarea name="" id="terms" cols="30" rows="10">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Aliquam aliquid
    at dignissimos doloribus explicabo suscipit vero! Aliquam beatae, cumque dignissimos eum expedita, in maxime neque optio quae quidem quos ut?Lorem ipsum dolor sit amet, consectetur adipisicing elit. Architecto aut blanditiis deserunt doloribus ea, eaque impedit laborum minima non officiis placeat quasi quidem repudiandae. At dolores explicabo inventore necessitatibus</textarea>
<input id="box" type="checkbox" checked="">

相关文章：