1

好的，所以我一直在寻找 JQuery 中的条件语句，但我找不到有关如何检查以确保两个输入框中的至少一个具有内容的解决方案。

这是我到目前为止所拥有的

$('#send').click(function(){ // when the button is clicked the code executes
$('.error').fadeOut('fast'); // reset the error messages (hides them)

var error = false; // we will set this true if the form isn't valid

var name = $('input#namn').val(); // get the value of the input field
var message = $('textarea#meddelande').val(); // get the value of the textarea
var phone = $('input#telefon').val(); // get the value of the input field
var email_compare = /^([a-z0-9_.-]+)@([da-z.-]+).([a-z.]{2,6})$/; // Syntax to compare against input
var email = $('input#epost').val(); // get the value of the input field

if(name == "" || name == " " || name == "namn" || name.length < 2) {
    $('input#namn').val("namn").css({ 'color': 'red' });
    error = true; // change the error state to true
}

if(phone == "" || phone == " " || phone == "telefon" || phone.length < 5) {
    $('input#telefon').val("telefon").css({ 'color': 'red' });
    error = true; // change the error state to true
}

if (email == "" || email == " " || email == "epost") { // check if the field is empty
    $('input#epost').val("epost").css({ 'color': 'red' });
    error = true;

}else if (!email_compare.test(email)) { // if it's not empty check the format against our email_compare variable
    $('input#epost').val("kontrollera epost").css({ 'color': 'red' });
    error = true;
}

if(message == "" || message == " " || message == "meddelande" || message.length < 10) {
    $('textarea#meddelande').val("meddelande").css({ 'color': 'red' });
    error = true; // change the error state to true
}

if(error == true) {
    $('#err-form').fadeIn('fast');
    return false;
}

var data_string = $('#ajax-contactform').serialize(); // Collect data from form

$.ajax({
    type: "POST",
    url: $('#ajax-contactform').attr('action'),
    data: data_string,
    timeout: 6000,
    error: function(request,error) {
        if (error == "timeout") {
            $('#err-timedout').fadeIn('fast');
        }
        else {
            $('#err-state').fadeIn('fast');
            $("#err-state").html('Ett fel uppstod: ' + error + '');
        }
    },
    success: function() {
        $('#ajax-contactform').fadeOut('fast');
        $('#success-msg').fadeIn('slow');
    }
});

return false; // stops user browser being directed to the php file

}); // 结束点击函数

它工作正常。但是，我想做一个有条件的陈述来检查并确保电子邮件或电话有内容。我不想强迫人们必须离开两者，但至少要离开一个。

因此，如果电话有内容（只有数字，而不是“电话”这个词），那么电子邮件不再是强制性的，反之亦然。如果电子邮件有内容，它仍然需要检查以确保它是有效的电子邮件。

我该怎么做呢？我在这里有点迷路:(

4

3 回答 3

1 
if (! ( (phone.length && phone != 'telefon') || email.length)) {
    //none of the above has input
}
于 2013-03-28T09:53:21.157 回答
0

您可以else if在电话和电子邮件if条件之间添加.. 这样如果phone存在email 不检查，否则如果email存在 ..phone 不检查

if(phone == "" || phone == " " || phone == "telefon" || phone.length < 5) {
  $('input#telefon').val("telefon").css({ 'color': 'red' });
   error = true; // change the error state to true
} else if (email == "" || email == " " || email == "epost") { // check if the field is empty
//^^^ HERE
   $('input#epost').val("epost").css({ 'color': 'red' });
   error = true;

}else if (!email_compare.test(email)) { // if it's not empty check the format against our email_compare variable
  $('input#epost').val("kontrollera epost").css({ 'color': 'red' });
  error = true;
}

但是我建议您看一下jquery 验证插件...易于使用和自定义...而不是编写整个代码

于 2013-03-28T09:56:59.877 回答
0

所以这就是我最终使用的。

$(function() {
        var input = $('input[type=text], textarea');

        input.focus(function() {

             var ibf = $(this);

             if(ibf.val() == ibf.attr('title'))
                 ibf.val('');

             if(ibf.css({ 'color': 'red' }))
                 ibf.css({ 'color': '' });

        }).blur(function() {
             var ibb = $(this);

             if(ibb.val() == '')
                 ibb.val(ibb.attr('title'));
        });

    });

    $("#telefon").keydown(function(e){
        var key = e.charCode || e.keyCode || 0;
        // allow backspace, tab, delete, arrows, numbers and keypad numbers ONLY
        return (  
            key == 8 ||   
            key == 9 ||  
            key == 46 ||  
            (key >= 37 && key <= 40) ||  
            (key >= 48 && key <= 57) ||  
            (key >= 96 && key <= 105));  
    });

    $('#send').click(function(){ // when the button is clicked the code executes
        $('.error').fadeOut('fast'); // reset the error messages (hides them)

        var error = false; // we will set this true if the form isn't valid

        var name = $('input#namn').val(); // get the value of the input field
        var message = $('textarea#meddelande').val(); // get the value of the input field
        var phone = $('input#telefon').val(); // get the value of the input field
        var email_compare = new RegExp(/^((([a-z]|\d|[!#\$%&'\*\+\-\/=\?\^_`{\|}~]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])+(\.([a-z]|\d|[!#\$%&'\*\+\-\/=\?\^_`{\|}~]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])+)*)|((\x22)((((\x20|\x09)*(\x0d\x0a))?(\x20|\x09)+)?(([\x01-\x08\x0b\x0c\x0e-\x1f\x7f]|\x21|[\x23-\x5b]|[\x5d-\x7e]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(\\([\x01-\x09\x0b\x0c\x0d-\x7f]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF]))))*(((\x20|\x09)*(\x0d\x0a))?(\x20|\x09)+)?(\x22)))@((([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])))\.)+(([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])))\.?$/i); // Syntax to compare against input
        var email = $('input#epost').val(); // get the value of the input field

        if(name == "" || name == " " || name == "namn" || name.length < 2) {
            $('input#namn').val("namn").css({ 'color': 'red' });
            error = true; // change the error state to true
        }

        var phone_valid = phone.length >= 6;
        var email_valid = email_compare.test(email);

        if(phone_valid && phone != 'telefon' || email_valid){ //one of two are populated
            //make donut

        }else{
            /*$('input#telefon').val("telefon").css({ 'color': 'red' });
            $('input#epost').val("epost").css({ 'color': 'red' });
            $('#err-form-contact').fadeIn('fast');*/                
            error = true;

            if (!phone_valid && phone != 'telefon' && phone != ''){
                 $('input#telefon').val("telefon").css({ 'color': 'red' });
            }

            if (!email_valid && email != 'epost' && email != ''){
                $('input#epost').val("epost").css({ 'color': 'red' });
            }
        }

        if(message == "" || message == " " || message == "meddelande" || message.length < 10) {
            $('textarea#meddelande').val("meddelande").css({ 'color': 'red' });
            error = true; // change the error state to true
        }

        if(error == true) {
            $('#err-form').fadeIn('fast');
            return false;
        }

        var data_string = $('#ajax-contactform').serialize(); // Collect data from form

        $.ajax({
            type: "POST",
            url: $('#ajax-contactform').attr('action'),
            data: data_string,
            timeout: 6000,
            error: function(request,error) {
                if (error == "timeout") {
                    $('#err-timedout').fadeIn('fast');
                }
                else {
                    $('#err-state').fadeIn('fast');
                    $("#err-state").html('Ett fel uppstod: ' + error + '');
                }
            },
            success: function() {
                $('#ajax-contactform').fadeOut('fast');
                $('#success-msg').fadeIn('slow');
            }
        });

        return false; // stops user browser being directed to the php file
    }); // end click function

现在它只检查两个框（电子邮件/电话）中的一个是否有内容。

于 2013-04-02T16:58:10.710 回答