父節點/父節點/類選擇器

類選擇器不工作，我如何總是得到我特別應用該函數而不是第一個函數的類，因爲如果按類選擇器工作，它們將具有相同的類第一類，而不是我正在申請的元素。父節點/父節點/類選擇器

HTML

<li class="space_form"> 
    <label> 
     Nome* 
     <input type="text" class="no-empty" name="Nome" value="Nome" onFocus="formEmptyLeft(this);clearText(this)" onBlur="formEmptyLeft(this);clearText(this)" /> 
     <div class="campo_vazio-left">*Preenchimento do campo obrigatório</div>                      
    </label> 
</li> 

<li class="fright"> 
    <label> 
     Sobrenome* 
     <input type="text" class="no-empty" name="Sobrenome" value="Sobrenome" onFocus="formEmptyRight(this);clearText(this)" onBlur="formEmptyRight(this);clearText(this)" /> 
     <div class="campo_vazio-right">*Preenchimento do campo obrigatório</div>                                  
    </label> 
</li>

的Javascript

function formEmptyLeft() 
{ 
    var input = document.getElementByClass('no-empty'); 

    if(input.value.length == 0) 
    { 
     document.getElementByClass('campo_vazio-left').style.display = 'block'; 
     document.getElementByClass('no-empty').classList.add('form_invalido');    
    } 
    else { 
     document.getElementByClass('campo_vazio-left').style.display = 'none'; 
     document.getElementByClass('no-empty').classList.remove('form_invalido');     
    }  
} 

function formEmptyRight() 
{ 
    var input = document.getElementByClass('no-empty'); 

    if(input.value.length == 0) 
    { 
     document.getElementByClass('campo_vazio-right').style.display = 'block'; 
     document.getElementByClass('no-empty').classList.add('form_invalido');    
    } 
    else { 
     document.getElementByClass('campo_vazio-right').style.display = 'none'; 
     document.getElementByClass('no-empty').classList.remove('form_invalido');     
    }  
}

來源

2013-07-15 Neylor Zaurisio

您在中添加的javascript代碼不完整 - 至少這是Chrome控制檯告訴的內容（請參閱截圖）。

Overview of errors

<input type="text" class="no-empty name_field" name="Nome" value="Nome" 
     onFocus="formEmptyLeft();clearText()" 
     onBlur="formEmptyLeft();clearText()" />

上方clearText()功能被解僱 - 但上面的代碼中沒有明文功能。

在第二個屏幕，你看到這幾行

var input = document.getElementsByClassName('no-empty'); 
if(input.value.length == 0)

你忘了加上document.getElementsByClassName('no-empty')[0];的結果，現在你有一個數組，而不是一個input元素。

Error location

在這裏你可以看到，document.getElementsByClassName('no-empty');返回數組。你忘了添加[0]來訪問數組的第一個元素。

result of your code returns an array

來源

2013-07-15 20:22:46 surfmuggle

檢查你的代碼，我相信你換貨document.getElementsByClassName而不是document.getElementByClass。

另一方面，考慮document.getElementsByClassName將返回一組元素，所以你應該做這樣的事情，如document.getElementsByClassName("myClass")[1].value。

有很多關於這個問題的信息，你是否陷入了一個特定的問題？

來源

2013-07-15 16:02:43 Zale

的第一個元素是0，所以document.getElementsByClassName（「MyClass的」）[0] – cocco

仍然沒有工作，我不知道爲什麼，但getElementByClassName不起作用。 –

getElementsByClassName ... elementsssss – cocco

如果我理解你是對的，我想你只是希望你的CSS選擇器更具體。所以你可以使用querySelector，例如...

document.querySelector（'。space_form .no-empty'）;

這將在'space_form'類下找到'no-empty'類。

雖然這需要IE8或更高版本，但如果您支持真正舊的瀏覽器，我認爲這可能是一個問題。

來源

2013-07-15 16:30:00 Boycey

父節點/父節點/類選擇器

回答

相關問題