Question

好的，我一直在努力解决这个问题。我还在学习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元素并更改边框颜色。但我只想更改出现错误信息的边框颜色。

我该怎么做？任何帮助将不胜感激，谢谢！

Answer 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');

JQuery选择特定的li元素

1 个答案: