Question

我不是最好的javascript，并且我无法禁用我的表单，除非我的所有输入字段都不为空。

我会添加其他内容，例如确保电子邮件是一封电子邮件，密码至少为8等等。但是现在我只是想让它工作如果所有输入都不为空且条款和条件选中复选框。

这是我的代码：

$('.m-name').keyup(function(){monthlyButtonActive();});
$('.m-email').keyup(function(){monthlyButtonActive();});
$('.m-password').keyup(function(){monthlyButtonActive();});
$('.m-password-confirm').keyup(function(){monthlyButtonActive();});
$('.m-terms').change(function(){monthlyButtonActive();});

function monthlyButtonActive()
{
    var complete = 0;
    if($('.m-name').val().length > 2){
        complete++;
    }else{
        complete = 0
    }
    if($('.m-email').val().length > 2){
        complete++;
    }else{
        complete = 0
    }
    if($('.m-password').val().length > 2){
        complete++;
    }else{
        complete = 0
    }
    if($('.m-password-confirm').val().length > 2){
        complete++;
    }else{
        complete = 0
    }
    if($('.m-terms').is(':checked')){
        complete++;
    }else{
        complete = 0
    }
    if(complete == 5){
        console.log(complete);
        console.log('its now complete');
        $('.monthly-button').children('.orange-button').addClass('active-button');
    }else{
        $('.monthly-button').children('.orange-button').addClass('active-button');
    }

因此，如果所有字段都不为空，我会在＆＃39; .active-button＆＃39;的按钮上添加一个类。但如果不是我想接受它的类。但是我的工作方式并不奏效。

有人可以帮助我吗？

由于

Answer 1

如果字段为空，则表示完成= 0后出现问题。你不应该做任何事情。如果它不为空，则提出完整变量，其他完成保持不变。

$('.m-name').keyup(function(){monthlyButtonActive();});
$('.m-email').keyup(function(){monthlyButtonActive();});
$('.m-password').keyup(function(){monthlyButtonActive();});
$('.m-password-confirm').keyup(function(){monthlyButtonActive();});
$('.m-terms').change(function(){monthlyButtonActive();});

function monthlyButtonActive()
{
    var m_name=0,m_email=0,m_password=0,m_password_confirm=0,m_terms=0;
    if($('.m-name').val().length > 2){
        m_name=1;
    }
    if($('.m-email').val().length > 2){
        m_email=1;
    }
    if($('.m-password').val().length > 2){
        m_password=1;
    }
    if($('.m-password-confirm').val().length > 2){
        m_password_confirm=1;
    }
    if($('.m-terms').is(':checked')){
        m_terms=1;
    }
    if(m_name==1&&m_email==1&&,m_password==1&&m_password_confirm==1&&m_terms==1){
        console.log(complete);
        console.log('its now complete');
        $('.monthly-button').children('.orange-button').addClass('active-button');
    }else{
        console.log(complete);
        console.log('its not complete');
    }

Answer 2

$('.m-name').keyup(function(){monthlyButtonActive();});
$('.m-email').keyup(function(){monthlyButtonActive();});
$('.m-password').keyup(function(){monthlyButtonActive();});
$('.m-password-confirm').keyup(function(){monthlyButtonActive();});
$('.m-terms').change(function(){monthlyButtonActive();});

function monthlyButtonActive()
{
    var complete = 1;
    if($('.m-name').val().length<=2){           
        complete = 0
    }
    else if($('.m-email').val().length <=2){           
        complete = 0
    }
    else if($('.m-password').val().length<=2){          
        complete = 0
    }
    else if($('.m-password-confirm').val().length <=2){           
        complete = 0
    }
    else if($('.m-terms').is(':checked')==false){            
        complete = 0
    }
    if(complete == 1){
        console.log(complete);
        console.log('its now complete');
        $('.monthly-button').children('.orange-button').removeClass('deactive-button').addClass('active-button');
    }else{
        $('.monthly-button').children('.orange-button').removeClass('active-button').addClass('deactive-button');
    }

jQuery，如果所有输入都不为空，则将类添加到按钮

2 个答案: