JQuery изменение атрибута HTML с использованием attr() возвращает объект объекта

Question

Я прочитал несколько разных статей и вопросов безрезультатно. У меня есть страница PHP, которая будет использовать AJAX для обновления easypiechart, используя значения из базы данных с проверкой каждые X минут. В этом примере я сократил время до 10 секунд с помощью окна предупреждения, чтобы показать, какие изменения были сделаны.

Я могу использовать attr() для просмотра «процента данных», однако он возвращает «Object Object», если я попытаюсь изменить значение атрибута «data-percent».

Я пытаюсь вручную изменить значение до 90 на данный момент, пока не смогу заставить эту функцию работать до добавления ответа ajax в качестве замены.

код:

<!-- Link to Google CDN's jQuery + jQueryUI; fall back to local --> 
<div id="test" class="easy-pie-chart txt-color-blue easyPieChart" data-percent="38" data-pie-size="160"> 
    <span class="percent percent-sign txt-color-blue font-lg semi-bold"></span> 
</div> 

<script src="http://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
<script> 
    if (!window.jQuery) { 
     document.write('<script src="js/libs/jquery-2.1.1.min.js"><\/script>'); 
    } 
</script> 

<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js"></script> 
<script> 
    if (!window.jQuery.ui) { 
     document.write('<script src="js/libs/jquery-ui-1.10.3.min.js"><\/script>'); 
    } 
</script> 

<script> 
// Setup AJAX request --> 
function updateWidgets(){ 
    $.ajax({ 
     url: "widgetGet.php", 
     type: "POST", 
     success: function(data) { 
     var response = $.parseJSON(data); 
     var idea = parseInt(response.test); 
     var ID = $("#test").attr("data-percent"); 
     var IDchange = $("#test").attr("data-percent", 90); 
     alert(ID); 
     } 
    }); 
    } 

    updateWidgets(); 
    setInterval(updateWidgets, 10000); 
    </script> 

Если вы переключите предупреждение от ID к IDchange вы можете увидеть, где моя проблема. Спасибо, ребята, поскольку я знаю, что я нахожусь в руках великого сообщества здесь.

Обновление, понятно, что функция предупреждения не должна использоваться для отладки. Какая проблема (и не уверен, что attr()) является решением, заключается в обновлении атрибута html с использованием ответа AJAX, который запускается каждые 10 секунд. Документация, такая как this, показывает, что атрибуты обновляются с помощью attr(), что приводит к моей путанице.

Вкратце, как я могу обновить атрибут html div, содержащий easypiechart, используя AJAX, который получает данные каждые 10 секунд?

Answer 1

После прочтения тонны статей, которые я нашел ответ который был easypiecharts себя. JS, связанный с easypiecharts, коснется атрибута данных. Чтение документации easypiecharts Я нашел ответ:

$('#test').data('easyPieChart').update(90); //to update the chart to 90% 

Моя проблема была направление, чтобы решить эту проблему, как тонны статей были ссылки на функцию атр(). Для моего сценария функция attr() не обновляла диаграмму (или prop(), если диаграмма не была обновлена, чтобы визуально увидеть обновление). Эти статьи ссылались на эту функцию на элемент, который не связан с другими внешними файлами JS.

Спасибо всем за ваш вклад, и сегодня я узнал некоторые важные уроки. Надеюсь, кто-то найдет этот ответ полезным для тех, кто хочет работать с AJAX и easypiecharts с динамическими процентными обновлениями.

Answer 2

Функция .attr() возвращает объект jQuery, когда он вызывается с двумя аргументами. Другими словами, вы возвращаете значение $("#test").

Это что, так что вы можете делать такие вещи, как

$("#test").attr("foo", "bar").hide(); 

Если вы хотите, чтобы увидеть значение после изменения, то:

var IDchange = $("#test").attr("data-percent", 90).attr("data-percent");