Javascript函数IF声明不起作用

Question

我想在某些输入内的值为空时另一个元素为空时向元素添加一个类。

由于某种原因，它只是登陆else语句，我以为我使用正确的语法来发送多个参数，但也许我错了。

任何想法？

var btnElementRegistro = document.getElementById('btnGuardar'); 
    btnElementRegistro.addEventListener('click' , validar); 

function validar(){ 

var elementNombre = document.getElementById('txtNombre'), 
    elementApellido1 = document.getElementById('txtApellido1'), 
    elementCel = document.getElementById('numCelular'); 


    addClass(txtNombre,txtApellido1,numCelular); 


} 

function addClass(pName, pApellido, pCel){ 

if(pName.value === '' && pApellido === '' && pCel ===''){ 

    pName.className = "error"; 
    pApellido.className = "error"; 
    pCel.className = "error"; 

}else{ 
    pName.className = "noError"; 
    pApellido.className = "noError"; 
    pCel.className = "noError"; 


    } 

} 

在此先感谢。

编辑：我想要使用if/else，以便我可以调用另一个函数来显示一个div（PopUp）时添加.noError。

var elementoVerInfo = document.getElementById('btnGuardar'), 
elementoBotonCerrar = document.getElementById('btnCerrar'); 

elementoVerInfo.addEventListener('click', function() { 
displayPopUp('popUpCorrecto2'); 
}); 

elementoBotonCerrar.addEventListener('click', function() { 
hidePopUp('popUpCorrecto2'); 
}); 

function displayPopUp(pIdDivToShow){ 
var fElementDivToShow = document.getElementById(pIdDivToShow), 
newClass =''; 
newClass = fElementDivToShow.className.replace('hide',''); 
fElementDivToShow.className = newClass + ' show'; 
} 

function hidePopUp(pIdDivToShow){ 
var fElementDivToShow = document.getElementById(pIdDivToShow), 
newClass =''; 
newClass = fElementDivToShow.className.replace('show',''); 
fElementDivToShow.className = newClass + ' hide'; 
} 

Answer 1

我想你想是这样的：

function validar(){ 

    var elementNombre = document.getElementById('txtNombre'), 
     elementApellido1 = document.getElementById('txtApellido1'), 
     elementCel = document.getElementById('numCelular'); 

    /*call it using the variables not the string identifiers.*/ 
    addClass(elementNombre, elementApellido1, elementCel); 
    /*addClass(txtNombre,txtApellido1,numCelular);*/ /* wrong */   
} 

function addClass(pName, pApellido, pCel){ 
    pName.className = pName.value === '' ? 'error' : 'noError'; 
    pApellido.className = pApellido.value === '' ? 'error' : 'noError'; 
    pCel.className = pCel.value === '' ? 'error' : 'noError'; 
} 

编辑回答在评论问题

一旦noError为，我可以在哪里添加对PopUp函数的调用补充？

如果你想添加一个函数调用，那么你必须使用if，因为?只允许单个语句。或者你可以如下做到这一点：

function addClass(pName, pApellido, pCel){ 
    pName.className = pName.value === '' ? 'error' : 'noError'; 
    pApellido.className = pApellido.value === '' ? 'error' : 'noError'; 
    pCel.className = pCel.value === '' ? 'error' : 'noError'; 

    if (pName.className === 'noError' && 
     pApellido.className === 'noError' && 
     pCel.className === 'noError'){ 
     callFunction(); /* call here the function you want */ 
    } 
} 

以上是一般的方法，因为我完全不知道，如果你想打电话给每个输入或只有一次的功能。如果你的目的是要求每个输入的功能，那么你可以做这样的：

function addClass(pName, pApellido, pCel){ 
    if (pName.value === ''){ 
     pName.className = 'error'; 
    } 
    else{ 
     pName.className = 'noError'; 
     displayPopUp(pName.id); 
    } 

    if (pApellido.value === ''){ 
     pApellido.className = 'error'; 
    } 
    else{ 
     pApellido.className = 'noError'; 
     displayPopUp(pApellido.id); 
    } 

    if (pCel.value === ''){ 
     pCel.className = 'error'; 
    } 
    else{ 
     pCel.className = 'noError'; 
     displayPopUp(pCel.id); 
    } 

} 

Answer 2

这是问题：

var elementNombre = document.getElementById('txtNombre'), 
elementApellido1 = document.getElementById('txtApellido1'), 
elementCel = document.getElementById('numCelular'); 

addClass(txtNombre,txtApellido1,numCelular); 

txtNombre，txtApellido1和numCelular是元素的ID，而不是变量名。

你应该通过你定义的变量名：

addClass(elementNombre, elementApellido1, elementCel);