AddClass/RemoveClass问题 [英] AddClass/RemoveClass Issues

问题描述

单击类A的按钮，将类B替换为B.单击类B的按钮，我需要执行一个操作.

On the click of button with class A, replace class A with class B. On the click of button with class B I need to perform an action.

它正在正确地应用/删除课程，但由于某种原因，它不会选择课程B?

It's applying/removing the class correctly but for some reason it won't select class B?

$(".changebut").click(function () {
   $("input[type=text]").fadeOut("fast", function () {
       $(".changebut").animate({
           width: "100%"
       }, 200).val("Submit again").removeClass("changebut").addClass("submitbut")
    })
}),
$(".submitbut").click(function () {
    alert('it worked!')
})

小提琴

推荐答案

最简单的解决方案，如果使用事件委托而不是直接绑定:

The easiest solution if to use event delegation instead of direct binding :

$(document).on('click', '.changebut', function () {
    $("input[type=text]").fadeOut("fast", function () {
        $(".changebut").animate({
             width: "100%"
         }, 200).val("Submit again").removeClass("changebut").addClass("submitbut")
    });
})

$(document).on('click', '.submitbut', function () {
    alert('it worked!')
})

最好的解决方案是直接绑定click事件并检查当前类:

The best solution is to bind the click event directly and check for the current class :

$(".changebut").on('click', function () {
    if($(this).is('.changebut')){
        $("input[type=text]").fadeOut("fast", function () {
            $(".changebut").animate({
                width: "100%"
            }, 200).val("Submit again").removeClass("changebut").addClass("submitbut")
        });
    }else{
        alert('i have an other class');
    }
})

这篇关于AddClass/RemoveClass问题的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！