Zagnieżdżone selektory jQuery

Question

Czy w ogóle istnieją zagnieżdżone selektory jQuery.

Na przykład:

jeśli strona ma również ID = "LeadEditForm_Title" gdzieś na niej następujące czynności ...

jQuery("[id='A0.R0.Main Phone Number']").live('mousedown',function(e) { 
    var container = $(this).width(); 
    var width_offset = -50; 
    var top_offset = 25; 
    var width = (container + width_offset).toString(); 
    jQuery(".mywidget").appendTo(document.body).css('width', width + 'px'); 
    jQuery(".mywidget").appendTo(document.body).css('position', 'absolute'); 
    jQuery(".mywidget").appendTo(document.body).css('top', ($(this).offset().top+top_offset).toString() + 'px'); 
    jQuery(".mywidget").appendTo(document.body).css('left', Math.round($(this).offset().left) + 'px'); 
}); 

PYTANIE:

Jak mogę zrobić jeśli jQuery(".LeadEditForm_Title") to zrobić powyższe ??? zasadzie zagnieżdżony wezwanie jQuery ... Widziałem przykłady gdzie oni mają:

jQuery(function(){ // my code goes here }); 

Ale chcę to zależeć od id „.LeadEditForm_Title”.

Answer 1

Aby selektorów gniazdo, należy użyć find:

jQuery('#mySelectorId').find('.mySelectorClass') 

To jest tak samo jak robi to za dobrze:

jQuery('#mySelectorId .mySelectorClass') 

Będąc pewny umieścić przestrzeń pomiędzy. Bez spacji wybierasz element o tym ID i tej klasy.

Chciałbym również zauważyć, że kod jest prawdopodobnie nie robi to, co myślisz, że jest:

jQuery("[id='A0.R0.Main Phone Number']").live('mousedown',function(e) { 
    var container = $(this).width(); 
    var width_offset = -50; 
    var top_offset = 25; 
    var width = (container + width_offset).toString(); 
    jQuery(".mywidget").appendTo(document.body).css('width', width + 'px'); 
    jQuery(".mywidget").appendTo(document.body).css('position', 'absolute'); 
    jQuery(".mywidget").appendTo(document.body).css('top', ($(this).offset().top+top_offset).toString() + 'px'); 
    jQuery(".mywidget").appendTo(document.body).css('left', Math.round($(this).offset().left) + 'px'); 
}); 

Ostatnie 4 jQuery(".mywidget") połączenia są dodając widżet do ciała za każdym razem. Naprawdę tylko chcą go dodać raz i zmienić css dla każdego stylu:

jQuery("[id='A0.R0.Main Phone Number']").live('mousedown',function(e) { 
    var container = $(this).width(); 
    var width_offset = -50; 
    var top_offset = 25; 
    var width = (container + width_offset).toString(); 
    jQuery(".mywidget").appendTo(document.body).css('width', width + 'px').css('position', 'absolute').css('top', ($(this).offset().top+top_offset).toString() + 'px').css('left', Math.round($(this).offset().left) + 'px'); 
}); 

który może być również obniżona do rozmowy jeden CSS:

jQuery("[id='A0.R0.Main Phone Number']").live('mousedown',function(e) { 
    var container = $(this).width(); 
    var width_offset = -50; 
    var top_offset = 25; 
    var width = (container + width_offset).toString(); 
    jQuery(".mywidget").appendTo(document.body).css({ 
     width: width + 'px', 
     position: 'absolute', 
     top: ($(this).offset().top+top_offset).toString() + 'px', 
     left: Math.round($(this).offset().left) + 'px'; 
    }); 
}); 

Uwaga, poza tym swój identyfikator nie ma spacji, zgodnie ze specyfikacją HTML. A jeśli masz prawidłowy identyfikator, byś go wybrać tak:

jQuery("#A0.R0.Main_Phone_Number") 

Answer 2

Jeśli chcesz zrobić zagnieżdżonych jQuery nazwać można to zrobić tak jak poniżej ...

$(document).ready(function(){ 
    $(document).ready(function(){ 
    // javascript code here... 
    }); 
});