2009-02-01 3 views
30

Ich habe einen jQuery-Selektor, der eine verkettete Funktion hat.Wie erhalte ich den Ausdruck eines jQuery-Selektors als Text?

Innerhalb der Funktion möchte ich Zugriff auf die TEXT erhalten, die den Ausdruck für den Selektor darstellt.

$("cat dog").function() { 

    // how do I get access to the "cat dog" string from inside THIS function ? 
}; 

Ich habe in diesem Codebeispiel über vereinfacht, was ich eigentlich tun möchte. Ich schreibe ein Plug-in und brauche Zugriff auf den Selektor, für den das umbrochene Set erstellt wurde. Offensichtlich habe ich in diesem speziellen Beispiel Zugriff auf "Katzenhund", weil ich es geschrieben habe. Stellen Sie sich das in einem Plugin vor.

Es ist ein wenig schwierig, dies zu googlen.

bearbeiten: die 'Selektor' Eigenschaft ist leider jetzt veraltet. http://jquery.com/upgrade-guide/1.9/#selector-property-on-jquery-objects

+0

Auch wenn Sie in die Ausgangswähler zu bekommen, Denke daran, dass du etwas wie $ (". cat .dog") haben könntest. eltern ("div: first"). find (". parrot"). je (function() {/*...*/}); wo Sie einfach keinen einfachen Selektor haben. – svinto

+0

das ist ein Punkt, mit dem ich kämpfe. Ich frage mich vielleicht, ob ich den Baum durchqueren sollte, aber meistens ist es nur in Ordnung, das letzte Element zu bekommen. Normalerweise möchte ich etwas wie $ ('. cat') machen. assertNonEmpty(). je (function() {}); –

+0

Jede Chance, die Sie auf jQuery 1.3.1 aktualisieren und "Selektor" verwenden könnten? – Nosredna

Antwort

18

Es gibt ein Attribut 'Selektor' im jQuery-Objekt, aber ich bin mir nicht sicher, dass es immer verfügbar ist.

+0

Ich konnte nicht darauf zugreifen, als ich es versuchte. Ich werde ein wenig länger warten, um zu sehen, ob jemand anderes freundlich genug ist, es für mich zu versuchen :) –

+0

seine neue in 1.3.1 Wenn Sie mit 1.2.6 es nicht verfügbar sein – redsquare

+0

Ich habe nur dieses in 1.3.1. – Nosredna

3

Wenn Sie Firebug verwenden, können Sie console.log(this) innerhalb der Funktion und sehen, ob die Selektorzeichenfolge irgendwo im Objekt zugänglich ist. Leider kenne ich die jQuery-API nicht.

+0

Ich kann nicht scheinen, es sofort dort zu sehen, aber +1 für das Erzählen mir etwas, das ich nicht wusste. Ich benutzte IE und Debugging in Visual Studio und nicht viel nützliches durch die Inspektion des Objekts –

+0

LoL! Danke Luca für deinen Hinweis. Habe vergessen, diese Variable in Funktion zu löschen. :) Habe meine Zeit hier gerettet !! :) Vielen Dank!! –

+0

Debugging freiwillig im IE? Wow, das ist irgendwie masochistisch ;-) –

-2

Nun, ich versuche immer noch herauszufinden, ob Sie versuchen, den Elementnamen zu bekommen? oder die ID und/oder Klasse oder alles davon.

Sie können Element mit diesem

 
var element =$(this).get(0); 
var id = $(this).attr('id'); 
var class=$(this).attr('class'); 

nicht sicher, was passiert, wenn Sie mehr als eine Klasse. könnte in ein Array oder etwas gehen, und Sie könnten das mit den Indizes bekommen.

+0

@pedalpete - ich will das eigentliche text "cat dog" - als string –

+0

@pedalpete - ich denke, vielleicht ist der Titel dieses Beitrags ein wenig irreführend, aber ich hoffte, die Frage selbst war klarer. etwas unklares, was ich will, ist der tatsächliche String - Wert, mit dem der $ ('cat dog') Selektor erstellt wurde: –

+0

ha. das ist wirklich ziemlich clever, leider brauche ich (öfter als n tatsächlich, um zu wissen, wann der Selektor null Elemente zurückgegeben hat. Ich versuche, nützlichere Fehlermeldungen für meine Behauptung Plugin http://StackOverflow.com/Questions/498469 –

8

Dies ist alles andere als optimal, funktioniert aber in einigen Fällen. Sie könnten Folgendes tun:

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'); 
}; 

Dies wird den letzten für das Element verwendeten Selektor zurückgeben. Aber es funktioniert nicht mit nicht existierenden Elementen.

<div id='foo'>Select me!</div> 
<script type='text/javascript'> 
$('#foo').getSelector(); //'#foo' 
$('div[id="foo"]').getSelector(); //'div[id="foo"]' 
$('#iDoNotExist').getSelector(); // undefined 
</script> 

Dies funktioniert mit jQuery 1.2.6 und 1.3.1 und möglicherweise anderen Versionen.

auch:

<div id='foo'>Select me!</div> 
<script type='text/javascript'> 
$foo = $('div#foo'); 
$('#foo').getSelector(); //'#foo' 
$foo.getSelector(); //'#foo' instead of 'div#foo' 
</script> 

bearbeiten
Wenn Sie immidiatly überprüfen, nachdem die Auswahl verwendet wurde, können Sie die folgenden in Ihrem Plugin verwenden:

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); 
}; 

Dann folgendes funktionieren würde:

<div id='foo'>Select me!</div> 
<script type='text/javascript'> 
$('div#foo'); 
$.getLastSelector(); //'#foo' 
$('#iDoNotExist'); 
$.getLastSelector(); // #iDoNotExist' 
</script> 

In Ihrem Plugin können Sie tun:

jQuery.fn.myPlugin = function(){ 
selector = $.getLastSelector; 
alert(selector); 
this.each(function() { 
    //do plugins stuff 
} 
} 

$('div').myPlugin(); //alerts 'div' 
$('#iDoNotExist').myPlugin(); //alerts '#iDoNotExist' 

Aber noch:

$div = $('div'); 
$('foo'); 
$div.myPlugin(); //alerts 'foo' 
+0

ha. das ist wirklich ziemlich schlau. Leider muss ich (mehr als oft nicht) wissen, wann der Selektor null Elemente zurückgegeben hat. Ich versuche, nützlichere Fehlermeldungen für mein Assertion-Plugin zu konstruieren http://StackOverflow.com/Questions/498469 - Simon –

+0

Ich bin nicht wach genug, um dies gerade jetzt neu zu lesen. Ich habe gerade erst gesehen, dass du das aktualisiert hast. wollte nur die Aufmerksamkeit auf jemanden mit diesem Code, dass, wenn sie etwas Gewirrheit auftreten, könnte es aufgrund dieses Problems sein: http://StackOverflow.com/Questions/535967/ –

0

Ich kann nicht herausfinden, wie die Referenz auf den String-Wert der nach innen $ zur Verfügung gestellt Wähler zu bekommen (‘ value_i_want_here '), wenn es an eine Funktion gebunden ist; scheint ein schwieriges Problem zu sein. Wenn Sie jedoch lieber in IE [x] testen, gibt es immer Firebug Lite, was sehr gut funktioniert mit console.log (var | val).

2

Das funktioniert, wenn Sie Selektor-String in Ihrer Funktion zugreifen möchten:

$(this).html(); 

,

zum Beispiel Dies wird auch funktionieren, wenn mehrere Wähler Gebrauch sind

$('#id1,#id2').click(function(){ 
    alert($(this).html()); 
}); 
1

Vielleicht das löst ihr problem:

var $jqueryItems = $(".my-selector"); 
console.log($jqueryItems.selector); // display ".my-selector" 
+0

.Selector ist nicht mehr verfügbar in jQuery: http://api.jquery.com/selector/ –

1

Für diejenigen, die in ihren Plugins Selektor-String zu jQuery gegeben erhalten möchten, ich bin froh, die große Antwort von @Pim Jager gegeben haben verbessert:

  1. Ab sofort (neueste Version 3.2.1) gibt es 3 Argumente in jQuery.fn.init Funktion - selector, context, root - nicht zwei;
  2. new Schlüsselwort sollte der Return-Anweisung von jQuery.fn.init hinzugefügt werden;
  3. In Ihrem Plugin die Selektoren als String zurückgegeben werden von $(this).getSelector();

Schließlich fordern, das ist, was ich für mich wie ein Zauber zu arbeiten bekam:

(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); 

Es arbeitet mit jQuery Versionen soweit es mich betrifft (von 1.7.0 bis 3.2.1).

PS. Funktioniert auch mit jQuery 1.2.3, das auch hier auf stackoverflow verfügbar ist.Also, ich denke, folgendes ist ok für alle jQuery Versionen Wenn Sie ein jQuery-Selektor Ausdruck als Text innerhalb des Plugin erhalten möchten:

// 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>

Verwandte Themen