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

时间:2015-12-08 22:02:58

标签: jquery select input slide

我正在尝试修改我之前制作的表单... 当第一个表格得到确认时,其中有一个特殊性可以向上滑动另一个表格。

现在我需要添加一个额外的函数来检查元素值, 在执行“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”,如果它什么都不做)

请有人帮助我...谢谢

1 个答案:

答案 0 :(得分:0)

你有一些关闭括号,你有onclick =&#34;确认()&#34;在你的HTML但没有确认功能。我从html中删除了onclick,并将结束括号向下移动到它们所属的底部。我还评论了一个e.preventDefault,因为你已经在它所属的底部做了它。

检查小提琴中的评论: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
});