Javascript 如何在选中输入收音机后滚动到div

我使用icheck jquery插件来设置输入收音机的样式

我需要在检查收音机时滚动到特殊div id

<input type="radio" class="checkb" name="selectplan" value="P6302" id="P6302">

和脚本

<script>

    $(document).ready(function () {
        $('input').iCheck({
            checkboxClass: 'icheckbox_square-red',
            radioClass: 'iradio_square-red',
            increaseArea: '20%' // optional
        });
    });
</script>

$（文档）.ready（函数（）{
$（'input'）.iCheck({
checkboxClass:'icheckbox_square-red'，
无线电课堂：“红色广场”，
increaseArea:'20%'//可选
});
});

因为它是一个单选按钮。您可以做的是为它创建一个onclick函数。正如你所知，当有人点击它时，需要向下滚动到一个部分。所以我不知道你为什么需要这个插件。用div把它包起来

$(".radio-button").click(function() {
        $('html, body').animate({

            scrollTop: $(".toyourdiv").offset().top-headerHeight
        }, 700);
});

您可以收听icheck库的“isChecked”事件，并滚动到带有复选框名称id的div：

$('input').on('ifChecked', function(event) {

   // Fixed scroll target       
   const target = $('#target');

   // For dynamic targets: adjust the target selector like
   // const target = $($(event.target)).attr('name');

   $('html,body').animate({
      scrollTop: target.offset().top
   }, 1000);
});

如果您希望每当单击复选框时滚动，请改用

ifToggled

事件

来源：

使用此代码

您可以使用单选按钮值的on来获得所需的结果

演示

var str=`Lorem Ipsum只是印刷和排版行业的虚拟文本。自16世纪以来，Lorem Ipsum一直是行业标准的虚拟文本，当时一位不知名的印刷商拿起一个打印工具，将其拼凑成一本打印样本书。它不仅存活了五个世纪，而且还跨越到电子排版，基本上保持不变。它在20世纪60年代随着包含Lorem Ipsum段落的Letraset表单的发布而流行，最近随着Aldus PageMaker等桌面出版软件的发布，包括Lorem Ipsum版本；
让html=$.map（document.querySelectorAll（'input'），el=>{
返回`${$（el.val（）}${str}`；
});
$（'#container'）.html（html.join（'
'））；
$（“输入[type=radio]”。在（'change'，函数（e）上{
$（'html，body'）。设置动画({
scrollTop:$（`$${$（e.target.val（）}'）.offset（）.top
}, 1000);
});
.mydiv{
填充物：5px；
边框：1px实心#ccc；
}
.mydiv b{
背景：#3c；
显示：块；
填充：10px；
颜色：#fff；
}

P6302
P6303
P6304
P6305
P6306
P6307
你能画出你希望人们能帮助你的东西吗
$('input').on('ifChanged', function(event){
     $('html, body').animate({
        scrollTop: $("#myDiv").offset().top
    }, 2000);
});