1

好的，我一直在努力解决这个问题。我还在学习 JQuery。

这是我所拥有的：

剧本：

$('ul li.error').animate({
    height: 'toggle',
    opacity: 'toggle'
    }, {
    duration: 500,
    specialEasing: {
    width: 'linear',
    height: 'easeInOutCubic'
    },
    complete: function() {

    $(this).each(function(){

        $(this).delay(4000);

        $(this).animate({
            height: 'toggle',
            opacity: 'toggle'
        }, {
            duration: 7000,
            specialEasing: {
            width: 'linear',
            height: 'easeInOutCubic'
        },
        complete: function(){
            $(this).delay(1000);
                $(this).parent().next().find('li input').css('border-color', 'red');
                $('#somediv').slideDown();  
            }

        });

    });

    }
});

的HTML：

<div>
   <ul>
 <li class="error">(Error Message if any)</li>
 <li class="label"><label></li>
 <li class="input"><input></li>

 <li class="error">(Error Message if any)</li>
 <li class="label"><label></li>
 <li class="input"><input></li>
   </ul>
</div>

我要做的是选择具有输入的 li 元素并更改边框颜色。但我只想更改出现错误消息的边框颜色。

我怎样才能做到这一点？任何帮助将不胜感激，谢谢！

4

1 回答 1

1

这是我刚刚制作的一个示例，但是选择这样的元素并不好。

$('.error').each(function(){
    var next = $(this).next();
    for( var i = 0; i < 5; i++ ) {
        if( next.hasClass('input') === false ) {
            next = next.next();
        } else {
            next.css('border', '1px solid red');
            break;
        }
    }
});

演示：http: //jsfiddle.net/2rdrr/

它遍历下一个元素.error并尝试查找.input，如果在 5 次尝试内没有找到它，它将放弃。如果它找到该元素，它会添加边框并中断循环，因此它不会继续查找。

注意：这不是很聪明，你可以控制你的页面，所以你应该知道元素在哪里，而不是去寻找它们。

这样做的更好方法是。

<div>
   <ul>
      <li class="error">(Error Message if any)</li>
      <li class="label"><label></li>
      <li class="input"><input></li>
   </ul>
   <ul>
      <li class="error">(Error Message if any)</li>
      <li class="label"><label></li>
      <li class="input"><input></li>
   </ul>
</div>

然后你可以这样做。

$('.error').parent().find('.input').css('border', 'red');
于 2013-08-15T22:28:35.227 回答