jquery检查是否内部元素

我想添加一个类到元素，如果用户点击它里面。jquery检查是否内部元素

所有常见的规则 - “内部”意味着它可能是一个孩子，孙子女等

如果里面，我需要添加一个类中 - 如果外类应除去。

我把这个例子拼凑在一起，这个例子很有用，但作为一个非JavaScript的人，我会很感激一些反馈，看它是否是一种合理的方法，如果它可以改进 - 通过改进，到jQuery/JavaScript的性能。

任何意见赞赏。

$("body").click(function (e) { 

    $fs = $(e.target).closest("fieldset.expand"); 

    if ($fs.length) { 
     $fs.addClass("focus"); 
    } 
    else { 
     $("fieldset.expand").removeClass("focus"); 
    } 
});

<body> 
    <fieldset class="expand"> 
     <input type="text" /> 
     <input type="text" /> 
     <input type="text" /> 
    </fieldset> 
</body>

来源

2015-09-30 John Ohara

可以添加到您的html？ –

@AlexChar - 增加了典型的使用html，但没什么特别的。 –

所以基本上你想要添加类，如果用户试图点击'fieldset'内有'expand'类的任何输入字段。如果这是真的，那么我们可以改进代码？让我知道！ – deepakb

让您fieldset可获得焦点（但不tabbable），使用tabindex属性具有负值。然后设置使用focusin focusout事件的逻辑：

$('fieldset.expand').on('focusin focusout', function() { 
 
    $(this).toggleClass('focus', $(this).find('*').addBack().is(':focus')); 
 
});

fieldset.focus { 
 
    outline: 0; 
 
    background: red; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 
<fieldset tabindex="-1" class="expand"> 
 
    <input type="text" /> 
 
    <input type="text" /> 
 
    <input type="text" /> 
 
</fieldset>

来源

2015-09-30 11:00:07

jquery检查是否内部元素

回答

相关问题