Как установить ширину и высоту динамически с помощью jQuery

Ответ 1

Вы можете сделать это:

$(function() {
  $("#mainTable").width(100).height(200);
});

Это имеет 2 изменения, теперь использует .width() и .height(), а также запускает код в событии document.ready.

Без оболочки $(function() { }) (или $(document).ready(function() { }), если вы предпочитаете), ваш элемент может еще не присутствовать, поэтому $("#mainTable") просто ничего не найдет... ну, делайте что-нибудь. Здесь вы можете увидеть рабочий пример.

Ответ 2

Как @Misha Морошко уже опубликовал сам, это работает:

$("#mainTable").css("width", 100);
$("#mainTable").css("height", 200);

Там какое-то преимущество в этой технике по сравнению с @Nick Craver приняло ответ - вы также можете указать разные единицы:

$("#mainTable").css("width", "100%");

Таким образом, метод @Nick Craver может быть неправильным выбором для некоторых пользователей. Из jQuery API (http://api.jquery.com/width/):

Разница между .css(width) и .width() заключается в том, что последний возвращает значение пикселя без единицы (например, 400), в то время как первое возвращает значение с неизменными единицами (например, 400 пикселей). Метод .width() рекомендуется, когда необходимо использовать ширину элемента в математическом вычислении.

Ответ 3

Попробуйте следующее:

<div id="mainTable" style="width:100px; height:200px;"></div> 

$(document).ready(function() {
  $("#mainTable").width(100).height(200);
}) ;

Ответ 4

Я попробовал ниже код, который он работал для мелкого

var modWidth = 250;
var modHeight = 150;

пример ниже: -

$( "#ContainerId .sDashboard li" ).width( modWidth ).height(modHeight);

Ответ 5

или используйте этот синтаксис:

$("#mainTable").css("width", "100px");
$("#mainTable").css("height", "200px");

Ответ 6

Я попробовал все вышеперечисленные предложения, и никто из них не работал у меня, они изменили clientWidth и clientHeight, а не фактическую ширину и высоту.

Документы jQuery для методов $(). width и height говорят: "Обратите внимание, что .width(" значение ") задает ширину содержимого поля независимо от значения свойства CSS-размера."

Подход css сделал то же самое, поэтому мне пришлось использовать методы $(). attr().

_canvas.attr('width', 100);
_canvas.attr('height', 200);

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