jQuery セレクターの式をテキストとして取得するにはどうすればよいですか?
-
20-08-2019 - |
質問
連鎖関数を持つ jQuery セレクターがあります。
関数内で、セレクターの式を表す TEXT にアクセスしたいと考えています。
$("cat dog").function() {
// how do I get access to the "cat dog" string from inside THIS function ?
};
このコード サンプルでは、実際にやりたいことを単純化しすぎています。私はプラグインを作成していて、ラップされたセットが作成されたセレクターにアクセスする必要があります。明らかに、この特定の例では、私が書いたので「cat Dog」にアクセスできます。これがプラグインに組み込まれているところを想像してみてください。
これをグーグルで検索するのは少し難しいです。
編集: 残念ながら、「selector」プロパティは現在非推奨になっています。 http://jquery.com/upgrade-guide/1.9/#selector-property-on-jquery-objects
解決
jQueryオブジェクトの「セレクタ」属性がありますが、私はそれは常に利用可能だかわからない。
他のヒント
これは、最適にはほど遠いですが、いくつかのケースで動作します。あなたは次のことを行うことができます:
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>
編集
セレクタが使用された後、あなたがimmidiatlyチェックすると、あなたのプラグインで、次の使用することができます:
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'
あなたは放火犯を使用している場合は、関数の内部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) では、引数が 3 つあります。
jQuery.fn.init
関数 -selector, context, root
- 2つではありません。 new
キーワードを return ステートメントに追加する必要があります。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. 。ここstackoverflowで入手可能なjQuery 1.2.3でも正常に動作します。したがって、プラグイン内のテキストとして 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>
私は、関数にバインドされたときに内部の$(「value_i_want_here」)に提供されるセレクタの文字列値への参照を取得する方法を見つけ出すことができませんでした。タフな問題のように思えます。あなたがIEでのテストを好む場合は、[x]は常にのFirebug Liteのにありますいます本当によくにconsole.log利用働く。(VAR |ヴァルを)
も、私はまだあなたが要素名を取得しようとしている場合を把握しようとしていますか?またはIDおよび/またはクラスまたはそれのすべて。
あなたはこれで要素を取得することができます。
var element =$(this).get(0); var id = $(this).attr('id'); var class=$(this).attr('class');
あなたは複数のクラスを持っている場合、何が起こるかわかりません。配列か何かに行くかもしれない、とあなたは、インデックスとそれを得ることができます。