JQuery увеличение с последней й

Question

JQuery увеличение с последней й

Как увеличить ширину последней строки? Я пытаюсь сделать его текущей ширины + 20 пикселей;

var header="<th id="tblHeader_1" style="width: 80px;"><span>Id</span></th>
<th class="headerSortDown" id="tblHeader_2" style="width: 300px;"><span>Title</span></th>
<th class="headerSortDown" id="tblHeader_3" style="width: 300px;"><span>Adress</span></th>";


//Increase last th width
header.find(th:last).css('width',currentwidth+20+'px');    
alert(header);

0

javascript html jquery css tableheader

Источник

user1041205 07 мар '14 в 08:21

4 ответа

Другие вопросы по тегам javascript html jquery css tableheader

user717214 07 мар '14 в 08:29 2014-03-07 08:29 · Answer 1 · 2014-03-07 08:29

Сначала вам нужно создать объект jQuery из вашей HTML-строки, затем вам нужно получить текущую ширину th прежде чем его увеличить:

th = $(header).find('th:last');
th.css('width', (th.width() + 20) + 'px');

2

Источник

user717214 07 мар '14 в 08:29

user3085310 07 мар '14 в 08:23 2014-03-07 08:23 · Answer 2 · 2014-03-07 08:23

Попробуйте конвертировать ваши header в объект JQuery с помощью $ чтобы использовать метод jQuery здесь:

$(header).find('th:last').css('width',currentwidth+20+'px');

Также вам нужно использовать ' ' обернуть вашу строку вместо " ":

var header='<th id="tblHeader_1" style="width: 80px;"><span>Id</span></th><th class="headerSortDown" id="tblHeader_2" style="width: 300px;"><span>Title</span></th><th class="headerSortDown" id="tblHeader_3" style="width: 300px;"><span>Adress</span></th>';

user2560137 07 мар '14 в 08:35 2014-03-07 08:35 · Answer 3 · 2014-03-07 08:35

var header = $('<th id="tblHeader_1" style="width: 80px;"><span>Id</span></th><th class="headerSortDown" id="tblHeader_2" style="width: 300px;"><span>Title</span></th><th class="headerSortDown" id="tblHeader_3" style="width: 300px;"><span>Adress</span></th>');
$(header[header.length-1]).css({width:"+=20"});
alert(header);

демо здесь http://jsfiddle.net/sBbcE/2/

1

Источник

user2560137 07 мар '14 в 08:35

user777147 07 мар '14 в 09:10 2014-03-07 09:10 · Answer 4 · 2014-03-07 09:10

Фильтр LIVE DEMO ()

Проблема здесь JQuery find() не очень хорошо работает с HTML String . Сначала нам нужно ввести в DOM, затем он будет работать нормально.

Работает нормально с filter() Метод лучше объяснение здесь Найти элемент в строке HTML

var header='<th id="tblHeader_1" style="width:80px;"><span>Id</span></th><th class="headerSortDown" id="tblHeader_2" style="width: 100px;"><span>Title</span></th><th class="headerSortDown" id="tblHeader_3" style="width:100px;"><span>Adress</span></th>';

var $header =  $(header);

var th = $header.filter("th:last");

th.css('width',th.width() + 50 + 'px');

$header.appendTo('#main');

Еще один способ с find() метод.

LIVE DEMO

var header='<th id="tblHeader_1" style="width:80px;"><span>Id</span></th><th class="headerSortDown" id="tblHeader_2" style="width: 100px;"><span>Title</span></th><th class="headerSortDown" id="tblHeader_3" style="width:100px;"><span>Adress</span></th>';

var currentwidth = 100;

$('#main').append(header).find('th:last').css('background-color','red');//For Testing pu

//Increase last th width
$('#main').find('th:last').css('width',currentwidth + 50 + 'px');

/questions/2200805/ispolzovanie-jquery-dlya-poiska-stroki-html