HTML JavaScript可变数据百分比属性

-1

我正在使用数据百分比属性，但我需要它是可变的。我使用JavaScript来得到一个文本文件中的数据，需要插入到数据的百分比值HTML JavaScript可变数据百分比属性

这将是很好做到这一点

data-percent=".change"

或

$('#test').attr('data-percent', '.change');

这里的我正在处理什么

<div class="wrap"> 

    <div class="holder"> 
     <div id="test" class="one" data-percent="85%"><span class="label">one</span> 
     </div> 
    </div> 

    <script type="text/javascript">                
    setTimeout(function start() { 

     $('.bar').each(function (i) { 
     var $bar = $(this); 
     $(this).append('<span class="count"></span>') 
     setTimeout(function() { 
     $bar.css('width', $bar.attr('data-percent')); 
     }, i * 100); 
     }); 

     $('.count').each(function() { 
     $(this).prop('Counter', 0).animate({ 
     Counter: $(this).parent('.bar').attr('data-percent') 
    }, { 
     duration: 2000, 
     easing: 'swing', 
     step: function (now) { 
      $(this).text(Math.ceil(now) + '%'); 
     } 
    }); 
}); 

}, 500) 

    </script>           
</div>

这里是我从文本文件中获取数据的JavaScript。这是我需要

var XHR = new XMLHttpRequest(); 
    XHR.open("GET", "file.txt", true); 
    XHR.send(); 
    XHR.onload = function(){ 
    var change = document.getElementById("one").innerHTML = (XHR.responseText.slice(6, XHR.responseText.indexOf("\n"))); 
    };

来源

2017-02-20 theloosegoos

的getElementById来代替静态数据的百分比值数据被调用，它实际上指向的CSS类（“一”）

改变这一行参数：

var change = document.getElementById("one").innerHTML = (XHR.responseText.slice(6, XHR.responseText.indexOf("\n")));

要这样：

var change = XHR.responseText.slice(6, XHR.responseText.indexOf("\n")); 
$('#test').attr('data-percent', change); 
$('.label').text(change); // to display the value in span

来源

2017-02-20 00:34:38

感谢响应。该代码更改标签。我一直在玩它，并不能得到它的工作。实际上改变百分比值的唯一代码是：$（'＃test'）。attr（'data-percent'，'55％'）;但它只是改变它与静态值我需要像$（'＃test'）。attr（'data-percent'，'.change'）;再次感谢您 – theloosegoos

'.change'是什么意思。这个点代表什么？ –

对不起，这是我的无知出来，你第一次钉了它，谢谢一堆。 – theloosegoos

HTML JavaScript可变数据百分比属性

回答

相关问题