jQuery $(this).addClass无效

时间:2016-08-17 15:44:06

标签: javascript php jquery

我有一个文本框列表,用户可以在其中删除一个字母但是当在文本框中删除了一个错误的字母时,我想addClass("danger")我想只在错误的字母文本框上添加类,我还附加了一个截图来说明问题。

demo

文本框中有一个名为box的类。

现在我的下拉功能如下所示。

function dropabc(event) {

    if ($(objBox).attr("correct1") != event.target.id) {

        $(".imageError").fadeIn('slow').delay(1000).hide(0);
        console.log("error");
        $(this).addClass('danger');

    } else {

        console.log(event.target.id);
        console.log("ok");
    }
}

$(this).addClass("danger")

但是,这不起作用,我只想将danger类添加到删除了错误值的框中。

//makes all the textbox red
$(".box").addClass("danger")

非常感谢任何帮助!

这是jQuery UI拖放功能,它正常工作:

        var objBox;
    $('.drag').draggable({

 revert: true,
        helper: 'clone',
        cursor: 'pointer',

       start: function(event, ui) {

            $(this).fadeTo('fast', 0.5);
                objBox=$(this);
        },
        stop: function(event, ui) {
            $(this).fadeTo(0, 1);
     }
});

$("#textbox, .box").droppable({
     hoverClass: "hoverPath",
    drop: function(event, ui) {

              var $this = $(this);
                        if ($this.val() == '') {
                            $this.val(ui.draggable.text());
                             $(this).addClass("checkDiv");
                             $(this).each(function(i, el){
                        $(el).addClass(myid[3]);
                                        });

                        }

        var empty = $(this).parent().find("input").filter(function() {
            return this.value === "";
        });
        if(empty.length) {
        console.log(empty.length);
        }
        else{
            console.log("done");
        }

                    }
});

这是PHP代码,它与文本框的数量相呼应:

for($x = 0 ; $x < count($code_words); $x++){

    echo "<input id='".$code_words[$x]."' ondrop='dropabc(event)' class='box' type='textbox'/>";

        }

1 个答案:

答案 0 :(得分:1)

当您在输入标记中嵌入ondrop事件时,您只是在运行一个函数。

因此,不要嵌入它,而是尝试使用jQuery on("drop")

$(document).on("drop", ".box", function(event){
      if ($(objBox).attr("correct1") != event.target.id) {

        $(".imageError").fadeIn('slow').delay(1000).hide(0);
        console.log("error");
        $(this).addClass('danger');

    } else {

        console.log(event.target.id);
        console.log("ok");
    }
})

很棒,它帮助你:)。

干杯,