steps.js 步骤条点击问题?

图片描述

 
 <script>
    var steps1 = steps({
            el: "#steps1",
            data: [
                { title: "步骤1", description: "",customHtml: "<div>我是1的自定义内容</div>"},
                { title: "步骤2", description: "",customHtml: "<div>我是1的自定义内容</div>"},
                { title: "步骤3", description: "",customHtml: "<div>我是1的自定义内容</div>"},
                { title: "步骤4", description: "" ,customHtml: "<div>我是1的自定义内容</div>"}
            ],
            sides: "start-single",
            iconType: "bullets",
            center: true,
            active: 0
    });
    $(function(){
        $(".steps-row-center .step:eq(0)").on("click",function(){
            steps1.setActive(0);
        });
        $(".steps-row-center .step:eq(1)").on("click",function(){
            steps1.setActive(1);
        });
        $(".steps-row-center .step:eq(2)").on("click",function(){
            steps1.setActive(2);
        });
        $(".steps-row-center .step:eq(3)").on("click",function(){
            steps1.setActive(3);
        })
    })
</script>

上面var定义的是插件的方法,active是步骤条的状态,代表的是进度条,num类型,我现在给每个圆圈点击事件(圆圈都是相同的class),插件给了方法可以设置active的值,steps1.setActive(num)可以设置它的值,但是我给的点击事件只有第一次点击有效,第二次点击就没有效果了。怎么解答?

阅读 4.1k
2 个回答

感觉应该是被替换掉了,试试这样

$(".steps-row-center").on("click", ".step:eq(0)",function(){
    steps1.setActive(0);
});
新手上路,请多包涵

博主是怎么解决的啊。我也遇到同样的问题

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题