Вложенные селекторы jQuery

Question

Есть ли в любом случае вложенные селекторы jQuery.

Например:

, если на странице также есть где-то ID = "LeadEditForm_Title", выполните следующее ...

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

ВОПРОС:

Как мне сделать, если jQuery(".LeadEditForm_Title") тогда сделать вышеупомянутое ??? в основном вложенный вызов jQuery ... Я видел примеры, где они имеют:

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

Но я хочу, чтобы это зависело от идентификатора ".LeadEditForm_Title".

Answer 1

Чтобы вложить селекторы, вы используете find:

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

Это то же самое, что и это:

jQuery('#mySelectorId .mySelectorClass')

Обязательно ставьте пробел между ними.Без пробела вы выбираете элемент с этим идентификатором и этого класса.

Я бы также отметил, что ваш код, вероятно, не выполняет то, о чем вы думаете:

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

Последние 4 jQuery(".mywidget") звонков добавляют виджет в тело каждый раз.Вы действительно хотите добавить его только один раз и изменить 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').css('position', 'absolute').css('top', ($(this).offset().top+top_offset).toString() + 'px').css('left', Math.round($(this).offset().left) + 'px');
});

, который также может быть уменьшен до одного вызова 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';
    });
});

Примечание вне этого ваш идентификатор не должен иметь пробелов, в соответствии со спецификацией HTML.И, если у вас есть действительный идентификатор, вы бы выбрали его следующим образом:

jQuery("#A0.R0.Main_Phone_Number")

Answer 2

Если вы хотите сделать вложенный вызов jQuery, вы можете сделать это следующим образом ...

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