Question

$('body').on('click', 'input, button, #el, li, .classTest, input[name=nametest], div > a.more', function(target) {
    console.log($(this).selector);
});

如何实现返回：

的函数选择器（）

'input', if you click on input;
'button', if you click on button;
'li', if you click on li;
'.classTest', if you click on .classTest;
'input[name=nametest]', if you click on input[name=nametest];
'div > a.more', if you click on div > a.more;

Answer 1

检查以下代码段

$(document).ready(function(){
  $('body').on('click', function(event) {
   var target=event.target;
    alert(target.type);
});
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div>
</div>
<input type="button" value="Click">

希望这有帮助

Answer 2

这很有可能，但是由于jQuery删除了jQuery 1.9中的.selector属性，因此需要更多的工作。

首先，请注意元素的完整选择器可能很长，包含许多类，ID，其他属性等等。我认为，您只想获得传递的匹配选择器到jQuery 。而且，该元素很可能匹配多个选择器;我的答案通过用字符串分隔相关的选择器来控制它;你可能希望有一个更复杂的组合。

我使用.is()和一个字符串变量，其中包含您在事件处理程序中可以访问的选择器。基本思想是，遍历所有选择器并连接匹配$(element).is(selector)的那些。

＆＃13;

function selector ( element, selectorList ) {
      var selector = "";
      for ( var i=0; i<selectorList.length; ++i ) {     
            if ( $(element).is(selectorList[i]) ) {
                if ( selector.length && selector[selector.length-1] != "," ) { selector += ","; }
                selector += selectorList[i];
            }
      }
      return selector;
}

$("document").ready(function(){
  
var selectorList = 'input, button, #el, li, .classTest, input[name=nametest], div > a.more';

$('body').on('click', selectorList, function(target) {
     alert(selector(this,selectorList.split(",")));
});
  
});

＆＃13;

* { cursor:pointer;}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<button>Click me!</button>

<div id='el' >This is #el, click me</div>

＆＃13;

Jquery从点击中获取选择器

2 个答案: