jquery возвращает [object Object]

Question

У меня есть небольшой вопрос о проблеме, с которой я имею дело довольно долгое время: у меня есть HTML, который отображает список элементов, хранящихся в h2db. Эти элементы отображаются правильно.

<tr th:each="item : ${list}"> 
    <td th:text="${item.getActualcost()}" id="actualcost">Actual Cost</td> 
</tr> 

Теперь я хотел бы добавить еще один столбец в этот список, показывая индикатор выполнения.

Я добавил этот код в HTML-части:

<div class="container"> 
    <div class="col-md-4"> 
    <div class="progress"> 
      <div id="progressPlaceholder"></div> 
    </div> 

Скрипт-часть выглядит следующим образом:

<script> 
    var rank=$('actualcost'),place=4; 
    var progress = '<div class="progress-bar" role="progressbar" aria-valuenow="'+rank+'" aria-valuemin="0" aria-valuemax="100" style="width: '+rank+'%;"><span class="show" id="totalUsers">Ranked '+place+' of '+rank+'</span></div>'; 
    $('#progressPlaceholder').empty().append(progress); 
</script> 

Проблема в том, что индикатор не beinge заполнены правильно , Поэтому я попытался выяснить, какую ценность он получит, добавив «+ rank +». К сожалению, я получаю только [object Object]. Может ли кто-нибудь помочь мне с этой проблемой? Значение должно быть int.

Answer 1

Когда вы получите элемент с JQuery, вы получаете набор JQuery, который снова является объектом.

var rank = $('actualcost') 

Обратите внимание, что выше было бы предположить, у вас есть элемент, глядя, как <actualcost></actualcost>, что вы, вероятно, не имеют.

Даже если элемент не найден, просто вызов $() возвращает объект.

Объект, представленный строкой, всегда [object Object].

При конкатенации объекта и строку, вы получите представление объектов строку, которая ... ждать его ... всегда [object Object]

var str = 'something something' + $('actualcost'); 

// str === 'something something[object Object]' 

Это именно то, что происходит в вашем коде

var rank=$('actualcost'),place=4; 
var progress = '<div class="progress-bar" role="progressbar" aria-valuenow="'+rank+' .... 

Вы, вероятно, хотели

var rank = $('#actualcost').text() ,place=4; 

в зависимости от того, что HTML на самом деле выглядит как (я не знаю Thymeleaf)

Answer 2

Ранг - это объект для вас.

console.log(rank) 

должен предоставить вам объект, а затем использовать соответствующий ключ. Это может выглядеть следующим образом:

rank['value']//just an example