如果子存在,则将类添加到父级

时间:2011-09-22 08:45:12

标签: jquery css codeigniter

你好我使用codeigniter来生成一个表单,表单错误只显示如果该字段有错误我使用twitter-bootstrap进行样式设置所以我需要一种方法来向div添加一类错误(带有类=“clear fix”)和输入if(span class =“help-inline”)作为子项存在。

不希望使用查询,因此它会正常降级,但任何选项都会很好

任何帮助都会很棒。希望有道理。代码低于谢谢

    <?php echo form_open('login'); ?>
    <fieldset>
    <div class="clearfix">
         <?php echo form_label('Email Address: ', 'email_address');?>
         <div class="input"><?php echo form_input('email_address', set_value('email_address'), 'id="email_address" class="xlarge" autofocus ');?>
         <?php echo form_error('email_address', '<span class="help-inline">', '</span>'); ?>
         </div>
    </div><!-- /clearfix -->
    <div class="clearfix">
         <?php echo form_label('Password: ', 'password');?>
         <div class="input"><?php echo form_input('password', '', 'id="password" class="xlarge"');?>
         <?php echo form_error('password', '<span class="help-inline">', '</span>'); ?>
         </div>
    </div><!-- /clearfix -->
    <div class="actions">
       <?php echo form_submit('submit', 'Login', 'class="btn primary"'); ?>
    </div>
    </fieldset>
    <?php echo form_close(); ?>

渲染html(如果触发错误)

<form action="http://unetics.site/index.php/login" method="post" accept-charset="utf-8">
    <div style="display:none">
        <input type="hidden" name="csrf_test_name" value="c0856f469b1f498480881a8512042ccf" />
    </div>
    <fieldset>
        <div class="clearfix">
            <label for="email_address">Email Address: </label>
            <div class="input">
                <input type="text" name="email_address" value="" id="email_address" class="xlarge" autofocus  />             
                <span class="help-inline">The Email Address field is required.</span>                   </div>
        </div><!-- /clearfix -->
        <div class="clearfix">
            <label for="password">Password: </label>
            <div class="input"><input type="text" name="password" value="" id="password" class="xlarge" />
                <span class="help-inline">The Password field is required.</span>
            </div>
        </div><!-- /clearfix -->
        <div class="actions">
            <input type="submit" name="submit" value="Login" class="btn primary" />
        </div>
    </fieldset>
</form> 

1 个答案:

答案 0 :(得分:3)

我建议使用:

$('.help-inline').closest('.clear-fix').addClass('error').end().prev('input').addClass('error');

JS Fiddle demo

JS Fiddle demo, with your rendered html(请注意,我已将jQuery closest()更改为:closest('.clearfix'))。

或者:

$('.clear-fix').each(
    function(){
        if ($(this).has('.help-inline')){
            $(this).addClass('error');
            $(this).find('input').addClass('error');
        }
     });

JS Fiddle demo

JS Fiddle demo, with your rendered html(请注意,我已将jQuery选择器更改为:$('.clearfix'))。

相关问题