Question

如何增加字符串中最后一个的宽度？我想让它当前宽度+ 20px;

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

Answer 1

尝试使用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>';

Answer 2

首先，您需要从HTML字符串创建一个jQuery对象，然后在增加它之前需要实际获取th的当前宽度：

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

Answer 3

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/

Answer 4

LIVE DEMO filter()

这里的问题JQuery find（）与HTML String不兼容。首先我们需要注入DOM，然后才能正常工作。

使用filter()方法可以更好地解释Find element at HTML string

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

Please look at https://stackoverflow.com/questions/7159426/using-jquery-to-search-a-string-of-html

jquery随着最后一次增加

4 个答案: