Я ищу способ взять ширину элементов перед элементом при наведении.

Я пробовал:

$('ul li').hover(function() {
$(this).prevAll().each(function() {
    var margin = $(this).width();
});
$(this).css('margin-left', margin + 'px');
});

Но консоль скажет:

Uncaught ReferenceError: маржа не определена

Любое решение? Благодарность

1
Keaire 16 Дек 2015 в 12:09

4 ответа

Лучший ответ

Я ищу способ определить ширину элементов перед элементом при наведении.

Вам нужно инициализировать вашу переменную вне цикла и просто добавить значения:

$('ul li').hover(function() {
  var margin = 0;
  $(this).prevAll().each(function() {
    margin += $(this).width();
  });
  $(this).css('margin-left', margin + 'px');
});
2
Jai 16 Дек 2015 в 09:13

Вам нужно определить поле внутри цикла, где определена переменная поля. Если в функции / цикле определено veriable, тогда «область действия» этой переменной - это функция / цикл, в которой она содержится.

$('ul li').hover(function() {
    $(this).prevAll().each(function() {
        var margin = $(this).width();
        $(this).css('margin-left', margin + 'px');
    });
});

Если вы хотите использовать margin вне цикла, то вам нужно определить его до того как это:

$('ul li').hover(function() {
    var margin = 0;
    $(this).prevAll().each(function() {
        margin = $(this).width();
    });
    $(this).css('margin-left', margin + 'px');
});

И для полного объема страницы определите, прежде чем что-либо делать:

var margin = 0;
$('ul li').hover(function() {
    $(this).prevAll().each(function() {
        margin = $(this).width();
    });
    $(this).css('margin-left', margin + 'px');
}); 

//margin can also be used here now.

Я думаю, что первое решение - это то, что вы ищете в данном случае, но я дал второе, если вы снова столкнетесь с чем-то похожим.

0
Dhunt 16 Дек 2015 в 09:16

Вы не можете использовать переменную margin вне области, в которой вы определяете или устанавливаете значение.

$('ul li').hover(function() {
    var that = this;
    $(that).prevAll().each(function() {
        var margin = $(this).width();
        $(this).css('margin-left', margin + 'px');
    });
});
0
Loyalar 16 Дек 2015 в 09:11

Доступ к переменной margin вне каждой функции приведет к неопределенности. Сохраните переменную вне каждой области функции, чтобы вы могли получить к ней доступ вне области:

$('ul li').hover(function() {
  var margin;
  $(this).prevAll().each(function() {
    margin = $(this).width();
  });
  $(this).css('margin-left', margin + 'px');
});

Но я могу понять, что в приведенном выше случае вы не получите список слева от того, что вы пытаетесь сделать. Итак, вы можете использовать так:

$('ul li').hover(function() {
  var $this = $(this);//'li'
  $(this).prevAll().each(function() {
    var margin = $(this).width();
    $this.css('margin-left', margin + 'px');//margin on 'li'
  });
});
1
Bhojendra Rauniyar 16 Дек 2015 в 09:16