0

在滑到下一组问题之前,我正在尝试验证每张幻灯片上的表格。

除了单选按钮外,一切似乎都很好。如果未选中一个按钮并且如果选中了答案,则我正在尝试向一组按钮添加一类“错误焦点”,除了 return $error = false;

这是表格http://www.foresightaus.com.au/form/

    $nextBtn.click(function(e){

        e.preventDefault();
        var newIndex = 0,
            currentSlide = $slide.eq(currentIndex),
            $text = currentSlide.find($('li input[type="text"]')),
            $email = currentSlide.find($('#yourEmail')),
            $radio = currentSlide.find($('li.radio-btns')),
            formFields = currentSlide.find("input:text, li.radio-btns"),
            $error = true;  

        formFields.removeClass("error-focus");  

        //-----------------------------------------------------------------
        //-- Validate Text Fields

        $text.each(function(){

            if($(this).val()==""){

                //errorMessage("Please Enter Your Name");
                $(this).focus().addClass("error-focus");
                $error = true;

            }else{

                $error = false;

            }

        }); // end text each

        //-----------------------------------------------------------------
        //-- Validate Email Fields

        if($email.val()==""){

            //errorMessage("Please Enter Your Email Address");
            $(this).focus().addClass("error-focus");
            $error = true;

        }else if(!isValidEmail($email.val())){

            //errorMessage("Please Enter a Correct Email Address");
            $(this).focus().addClass("error-focus");
            $error = true;

        }else{

                $error = false;

        }

        //-----------------------------------------------------------------
        //-- Validate Radio Fields

        $radio.each(function(){

            if (!$(this).find(':checked')) {

               $(this).addClass("error-focus");
               $error = true;

            }

            else {

              $error = false;

            }

        }); // end radio each

        //-----------------------------------------------------------------

        if($error = false){

            if(currentIndex<lastIndex){
                newIndex = currentIndex+1;
            }

            slideToImage(newIndex); 

        }       

    });

    function isValidEmail(email) {
        var emailRx = /^[\w\.-]+@[\w\.-]+\.\w+$/;
        return  emailRx.test(email);
    }       
4

2 回答 2

0

You should add a div around each radio group, and if one of the radio buttons isn't checked, you should just give the div the red border that you're giving the other fields. An example:

HTML

<form>
<div id="group-1-wrapper">
<input type="radio">
<input type="radio">
</div>
</form>

js:

if(error) // your handling
$("#group-1-wrapper").addClass("error-focus");
于 2013-03-24T23:55:20.063 回答
0

我尝试了几种不同的方法,但这对我有用。@Evan 感谢您为我指出正确的方向

        //-----------------------------------------------------------------
        //-- Validate Radio Fields

        $radio.each(function(){

            if ($(this).find('input:radio').is(':checked')) {

                $error = false;

            }else{

                $(this).addClass("error-focus");
                $error = true;

            }

        }); // end radio each
于 2013-03-25T00:39:38.187 回答