Question

我遇到的问题JQuery功能是它只在我刷新网页时才有效，它在每个浏览器上都是这样工作的。我想要做的是，一旦特定div容器中的所有文本字段都包含在其中的数据，我希望容器插入复选标记图像。但是目前只有在输入文本字段中的所有数据并刷新浏览器后，此图像才会显示。

.rightbilling是div容器的类，其textfields我试图评估，'＃step1'是包含.rightbilling的字段集。

我一直试图解决这个问题几个小时..非常感谢帮助。如果您需要更多信息，请告诉我。

$(document.body).ready(function() {
        var all_complete = true;    
    $(".rightbilling").find("input:text").each(function(){


        if ($(this).val() == '' ) {
            all_complete = false;
            return true;
        };


    if (all_complete) {
        $("#step_1")
        .animate({
            paddingBottom: "120px"
        })
        .css({
            "background-image": "url(images/check.png)",
            "background-position": "bottom center",
            "background-repeat": "no-repeat"
        });

        $("#step_2").css({
            opacity: 1.0
        });
        $("#step_2 legend").css({
            opacity: 1.0 // For dumb Internet Explorer
        });
    };
});

Answer 1

因为您正在使用document.ready函数，所以只在页面加载时调用您的函数。在输入字段被更改时，您需要查看附加onChange侦听器以调用您的函数。

Answer 2

$(document.body).ready(
    function () {
        var validation = function () {
            var all_complete = true;
            $(".rightbilling").find("input:text").each(
                function () {
                    if ($(this).val() == '') {
                        all_complete = false;
                        return true;
                    }
                    if (all_complete) {
                        $("#step_1").animate({
                            paddingBottom: "120px"
                        }).css({
                            "background-image": "url(images/check.png)",
                            "background-position": "bottom center",
                            "background-repeat": "no-repeat"
                        });
                        $("#step_2").css({
                            opacity: 1.0
                        });
                        $("#step_2 legend").css({
                            opacity: 1.0 // For dumb Internet Explorer
                        });
                    }
            });
        }
        validation();  //call it when the page is loaded
        $(".rightbilling").find("input:text").on("change",validation); //call it when input changes
    }
);

JQuery函数仅适用于浏览器刷新

2 个答案: