的複雜條件

我有我的頁面頂部的一組指令：的複雜條件

<div class="instructions"> 
     <div id="step1" class="step"><span class="step_active">1</span><span class="step_title_active">General Info</span></div> 
     <div id="step2" class="step"><span class="step_next">2</span><span class="step_title">Select Contact</span></div> 
     <div id="step3" class="step"><span class="step_next">3</span><span class="step_title">Log Details</span></div> 
    </div>

我有一個顯示自己作爲條件得到滿足的一種形式。第一個條件是在出現下一部分之前，兩個選擇框都必須選擇選項。

<script> 
$(document).ajaxSuccess(function() { 
    $("#test").hide(); 
    $("#comType, #comDirection").bind('change', function() { 
     // show the button if they both have a value 
     if ($("#comType").val().length > 1 && $("#comDirection").val().length > 1) { 
      $("#test").fadeIn(); 
     } 
    }); 
}); 
</script>

我如何更改＃第一步＃第二步的類，以便在滿足上述條件的，如出現：

<div id="step1" class="step"><span class="step_complete">1</span><span class="step_title">General Info</span></div> 
    <div id="step2" class="step"><span class="step_active">2</span><span class="step_title_active">Select Contact</span></div>

的思考？

來源

2013-09-29 Mark

只是想在滿足條件的js轉DIV＃第一步和第二步＃裏面的跨度類。＃Step1將＃Step2類應用於內部跨度，並且＃step2將具有＃Step1類。這基本上是一個麪包屑導航的形式，突出你的步驟。 – Mark

在帖子中，目前設置第1步似乎處於活動狀態。 – Mark

小提琴？演示？有事要繼續... –

您可以使用addClass & removeClass jQuery的屬性。

試試這個：

if ($("#comType").val().length > 1 && $("#comDirection").val().length > 1) { 
    $("#test").fadeIn(); 
    $("#step1").children("span").removeClass("step_active").addClass("step_complete"); 
    $("#step2").children("span").removeClass("step_next").addClass("step_active"); 
    $("#step1").children("span").next("span").removeClass("step_title_active").addClass("step_title"); 
    $("#step2").children("span").next("span").removeClass("step_title").addClass("step_title_active"); 
}

來源

2013-09-30 05:01:31

'$（「＃step1」）。children（「span」）'可以寫成'$（「＃step1> span」）' –

@ThierryJ。 $（「＃step1> span」）遍歷所有的子元素，這裏只需要遍歷第一個子元素。 –

回答

相關問題