如何選擇jquery選項卡，如果errorLable顯示

Question

即時將jquery UI選項卡應用到我的應用程序，我即將對此應用jQuery的驗證類。我的問題是，如果我在某些div中出現錯誤，應該選擇div，並在點擊保存按鈕時向用戶顯示錯誤。

我試圖

$('#tabs > div').each(function(i){ 
        if($('.errortd', this).not(':hidden').length>0){ 
           $("#tabs").tabs('select', i);            

         }); 

       }); 

但我有沒有運氣任何幫助的感謝很多

我的標籤的div

<div id="tabs"> 
      <ul> 
      <li><a href="#editEmployeeDIV"><?php echo __("View/Edit employees") ?></a></li> 
      <li><a href="#addEmployeeDIV"><?php echo __("Assign new employees") ?></a></li> 
      </ul> 
    <div id="editEmployeeDIV"> 
    </div> 
    <div id="editEmployeeDIV"> 
    </div> 
</div> 

我的錯誤標貼上課errortd

<label for="txtAmount_146" generated="true" class="errortd" style="display: none; ">This field is required.</label> 

Answer 1

你有幾個問題秒。

首先是在你的代碼流浪);：

if($('.errortd', this).not(':hidden').length>0){ 
    $("#tabs").tabs('select', i);            
}); // <------ Right here 

然後你使用:hidden當你不應該。從fine manual：

元素可以被認爲是隱藏的幾個原因：
[...]

• 的祖先元素是隱藏的，所以元素不顯示在頁面上。

這意味着<label>總是被認爲是隱藏的，如果它是在非當前選項卡。

你可以做這樣的事情：

var $shown = $(this).find('.errortd').filter(function() { 
    var dpy = $(this).css('display'); 
    return !dpy || dpy != 'none'; 
}); 
if($shown.length > 0) 
    $("#tabs").tabs('select', i); 

演示：http://jsfiddle.net/ambiguous/agrCe/

或者添加一個類的<label>元素隱藏它們，而不是手動隱藏它們。你有這樣的位CSS的：

.no-error { 
    display: none; 
} 

然後：

if($(this).find('.errortd:not(.no-error)').length > 0) 
    $("#tabs").tabs('select', i); 

演示：http://jsfiddle.net/ambiguous/Z4D2A/