当特定元素没有错误类时,如何仅slideDown / Up

时间:2014-04-19 20:18:14

标签: javascript jquery html css

使用以下代码我上下滑动兄弟div。

但现在我只想在其中的元素未分配给错误类时允许这样做。

的jQuery

$('input').on('focus blur', function(e){
    $(this).siblings('div')[e.type === 'focus' ? 'slideDown' : 'slideUp']('fast');
})

HTML

<div class="input">
    <label>Name</label>
    <input type="text">
    <div>
        <div class="addition error">Input error 1</div>
    </div>
</div>
<div class="input">
    <label>Rest</label>
    <input type="text">
    <div>
        <div class="addition error">Input error 2</div>
    </div>
</div>
<div class="input">
    <label>Rest</label>
    <input type="text">
    <!-- So only this should be able to slide -->
    <div>
        <div class="addition">Input addition 1</div>
    </div>
</div>

2 个答案:

答案 0 :(得分:2)

只需检查事件处理程序中的类

$('input').on('focus blur', function(e){
    if ( $(this).closest('.input').find('.error').length === 0)
        $(this).siblings('div')[e.type === 'focus' ? 'slideDown' : 'slideUp']('fast');
});

答案 1 :(得分:2)

这个怎么样?

$('input').on('focus blur', function(e){
    $(this).siblings('div').children().not('.error')[e.type === 'focus' ? 'slideDown' : 'slideUp']('fast');
})

<强> FIDDLE