Jquery

Question

我正在尝试修改我之前制作的表格... 具有特殊性的是，一旦确认第一个表格，就可以滑出另一个表格。

现在我需要添加一个额外的函数来检查元素值，在执行 "CONFIRM" 函数之前。

这是第一个函数的 "FIDDLE" ... （按"RUN"，如果没有反应）

现在我做了什么来完成我对额外功能的尝试；

// MY PROBLEM is in here
$(document).ready(function() {
$('.Confirm-UP').click(function(e) {
    var isValid = true;
    $('input[type="text"].required').each(function() {
        if ($.trim($(this).val()) == '') {
            isValid = false;
            $(this).css({
                "box-shadow": "0 0 7px #D11919"
            });
        }
        else {
            $(this).css({
                "box-shadow": ""
            });
        }
    });
    if (isValid == false) 
        e.preventDefault();

// Button Click Check Selectors
 if ($("#UsrAr")[0].selectedIndex <= 0) {
           isValid = false;
            $("#UsrAr").css({
                "box-shadow": "0 0 7px #D11919"
            });
        }
        else {
            $("#UsrAr").css({
                "box-shadow": ""
            });
        }
    });
    if (isValid == false) 
        e.preventDefault();
    else 
        $('.FORM2').animate({
      top: '-202px'
    }, 1000);
});
// Button Click send FORM to BACK
$(document).ready(function() {
  $('#Back').click(function() {
    $('.FORM2').animate({
      top: '0px'
    }, 1000);
  });
});

这是我尝试的完整作品的 "FIDDLE" （按"RUN"，如果没有反应）

有人可以帮助我吗...谢谢

Answer 1

您有一些右括号不合适，您的 html 中有 onclick="Confirm()" 但没有确认功能。我从 html 中删除了 onclick 并将您的右括号向下移动到它们所属的底部。我还注释掉了 e.preventDefault 因为你已经在它所属的底部做了它。

查看fiddle中的评论：http://jsfiddle.net/uvh4rapv/3/

$(document).ready(function() {
    $('.Confirm-UP').click(function(e) {
        console.log(".confirm-up clicked")
        var isValid = true;
        $('input[type="text"].required').each(function() {
            if ($.trim($(this).val()) == '') {
                isValid = false;
                $(this).css({
                    "box-shadow": "0 0 7px #D11919"
                });
            }
            else {
                $(this).css({
                    "box-shadow": ""
                });
            }
        });


       // COMMENTED THIS OUT BECAUSE YOU"RE DOING THE e.preventDefault BELOW
       //if (isValid == false)     
       //    e.preventDefault();

// Button Click Check Selectors
     if ($("#UsrAr")[0].selectedIndex <= 0) {
               isValid = false;
                $("#UsrAr").css({
                    "box-shadow": "0 0 7px #D11919"
                });
            }
            else {
                $("#UsrAr").css({
                    "box-shadow": ""
                });
            }
       //}); COMMENTED OUT THESE SHOULD BE BELOW  
        if (isValid == false){
            e.preventDefault();
        }
        else {
            console.log('no errors found')
            $('.FORM2').animate({
              top: '-200px'
            }, 1000);
        }
    }); // THIS IS WHERE THE CLICK HANDLER SHOULD END
});

Jquery - 元素值检查然后向上滑动表格

Jquery - Elements Value Check then Slide Form UP

select

input

slide