Как мне получить выражение селектора jQuery в виде текста?
-
20-08-2019 - |
Вопрос
У меня есть селектор jQuery, который имеет цепную функцию.
Внутри функции я хочу получить доступ к ТЕКСТУ, представляющему выражение для селектора.
$("cat dog").function() {
// how do I get access to the "cat dog" string from inside THIS function ?
};
В этом примере кода я чрезмерно упростил то, что я на самом деле хочу сделать.Я пишу подключаемый модуль, и мне нужен доступ к селектору, для которого был создан обернутый набор.Очевидно, что в этом конкретном примере у меня есть доступ к "cat dog", потому что я его написал.Так что просто представьте, что это находится в плагине.
Для этого немного сложно поискать в Google.
Редактировать: свойство 'selector', к сожалению, в настоящее время устарело. http://jquery.com/upgrade-guide/1.9/#selector-property-on-jquery-objects
Решение
В объекте jQuery есть атрибут 'selector', но я не уверен, что он всегда доступен.
Другие советы
Это далеко не оптимально, но в некоторых случаях работает.Вы могли бы сделать следующее:
jQuery.fn._init = jQuery.fn.init
jQuery.fn.init = function( selector, context ) {
return (typeof selector === 'string') ? jQuery.fn._init(selector, context).data('selector', selector) : jQuery.fn._init( selector, context );
};
jQuery.fn.getSelector = function() {
return jQuery(this).data('selector');
};
Это вернет последний селектор, используемый для элемента.Но это не будет работать с несуществующими элементами.
<div id='foo'>Select me!</div>
<script type='text/javascript'>
$('#foo').getSelector(); //'#foo'
$('div[id="foo"]').getSelector(); //'div[id="foo"]'
$('#iDoNotExist').getSelector(); // undefined
</script>
Это работает с jQuery 1.2.6 и 1.3.1 и, возможно, с другими версиями.
Также:
<div id='foo'>Select me!</div>
<script type='text/javascript'>
$foo = $('div#foo');
$('#foo').getSelector(); //'#foo'
$foo.getSelector(); //'#foo' instead of 'div#foo'
</script>
Редактировать
Если вы проверяете сразу после использования селектора, вы могли бы использовать следующее в своем плагине:
jQuery.getLastSelector = function() {
return jQuery.getLastSelector.lastSelector;
};
jQuery.fn._init = jQuery.fn.init
jQuery.fn.init = function( selector, context ) {
if(typeof selector === 'string') {
jQuery.getLastSelector.lastSelector = selector;
}
return jQuery.fn._init( selector, context );
};
Тогда сработало бы следующее:
<div id='foo'>Select me!</div>
<script type='text/javascript'>
$('div#foo');
$.getLastSelector(); //'#foo'
$('#iDoNotExist');
$.getLastSelector(); // #iDoNotExist'
</script>
В вашем плагине вы могли бы сделать:
jQuery.fn.myPlugin = function(){
selector = $.getLastSelector;
alert(selector);
this.each( function() {
//do plugins stuff
}
}
$('div').myPlugin(); //alerts 'div'
$('#iDoNotExist').myPlugin(); //alerts '#iDoNotExist'
Но все же:
$div = $('div');
$('foo');
$div.myPlugin(); //alerts 'foo'
Если вы используете firebug, вы могли бы console.log(this)
внутри функции и посмотрите, доступна ли строка селектора где-нибудь в объекте.Извините, я не знаком с jQuery API.
Это сработает, если вы хотите получить доступ к строке селектора в вашей функции:
$(this).html();
Это также будет работать, если используется множественный селектор,
например,
$('#id1,#id2').click(function(){
alert($(this).html());
});
Может быть, это решит вашу проблему :
var $jqueryItems = $( ".my-selector" );
console.log( $jqueryItems.selector ); // display ".my-selector"
Для тех, кто хочет проникнуть в строку выбора своих плагинов, предоставленную jQuery, я рад улучшить отличный ответ, данный @Pim Jager:
- На данный момент (последняя версия 3.2.1) в
jQuery.fn.init
функция -selector, context, root
- не два; new
ключевое слово должно быть добавлено к оператору возвратаjQuery.fn.init
;- Внутри вашего плагина селекторы возвращаются в виде строки при вызове
$(this).getSelector();
Наконец-то, это то, что у меня должно сработать на меня как заклинание:
(function($, window, document, undefined) {
$.fn._init = $.fn.init
$.fn.init = function( selector, context, root ) {
return (typeof selector === 'string') ? new $.fn._init(selector, context, root).data('selector', selector) : new $.fn._init( selector, context, root );
};
$.fn.getSelector = function() {
return $(this).data('selector');
};
$.fn.YOUR-PLUGIN = function() {
var selector = $(this).getSelector(); // selectors string given to jQuery
// other code
}
})(jQuery, window, document);
Насколько мне известно, это работает с версиями jQuery (от 1.7.0 до 3.2.1).
PS.Отлично работает даже с jQuery 1.2.3, доступным и здесь, в stackoverflow.Итак, я думаю, следующее подходит для всех версий jQuery, если вы хотите получить выражение селектора jQuery в виде текста внутри плагина:
// our plugin
(function($, window, document, undefined) {
$.fn._init = $.fn.init
$.fn.init = function( selector, context, root ) {
return (typeof selector === 'string') ? new $.fn._init(selector, context, root).data('selector', selector) : new $.fn._init( selector, context, root );
};
$.fn.getSelector = function() {
return $(this).data('selector');
};
$.fn.coolPlugin = function() {
var selector = $(this).getSelector();
if(selector) console.log(selector); // outputs p #boldText
}
})(jQuery, window, document);
// calling plugin
$(document).ready(function() {
$("p #boldText").coolPlugin();
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.2.3/jquery.min.js"></script>
<p>some <b id="boldText">bold text</b></p>
Я не мог понять, как получить ссылку на строковое значение селектора, предоставленного inside $('value_i_want_here') при привязке к функции;кажется, это сложная проблема.Однако, если вы предпочитаете тестирование в IE[x], всегда есть Firebug Облегченный который действительно хорошо работает, используя console.log(var| val).
ну, я все еще пытаюсь выяснить, пытаетесь ли вы получить название элемента?или идентификатор и / или класс, или все это.
Вы можете получить элемент с помощью этого
var element =$(this).get(0); var id = $(this).attr('id'); var class=$(this).attr('class');
не уверен, что произойдет, если у вас будет более одного класса.может перейти в массив или что-то в этом роде, и вы могли бы получить это с помощью индексов.