javascript - 在值上附加元素

Question

我正在使用roundSlider作为径向滑块。这给了我幻灯片的价值。在幻灯片上我正在添加span元素。

所以我真正想要的是span应该按照车牌号。如果有 22 个盘子，那么span应该只有 22 个，如果盘子是 10 个，那么span也应该是 10 个，反之亦然。

查找小提琴演示

目前，它只是附加 1 个长度。我希望它根据var tp值附加（添加和删除）。

var tp = $('.rs-tooltip').text() / 1000;
$('#plates span').text(tp);
$('.mbox').append('<span></span>')

Answer 1

演示小提琴在这里

添加 for 循环事件。for 循环将附加span依赖范围值。最初删除的内部内容。.mbox然后它将在 for 循环的帮助下重新添加

function traceEvent(e) {
        var tp = $('.rs-tooltip').text() / 1000;
        console.log(tp);
      $('#plates span').text(tp);
      $('.mbox').html("");//empty
    for(var i=0; i<tp; i++){
        $('.mbox').append('<span id="'+[i]+'"></span>')//add
        }

Answer 2

您可以检查以下代码 1. 删除所有跨度 2. 根据 tp 值添加跨度

 function traceEvent(e) {
  var tp = $('.rs-tooltip').text() / 1000;
  $('#plates span').text(tp);
  $('.mbox').html("");
  for(var i=0; i<tp; i++){
     $('.mbox').append('<span></span>');
  }
 }

Answer 3

请参阅此处更新：https ://jsfiddle.net/ddan/a6devr3b/3/

我对你traceEvent先清空盘子的方法做了一些小改动。

function traceEvent(e) {
    var tp = $('.rs-tooltip').text() / 1000;
    console.log(tp);
    $('#plates span').text(tp);
    $('.mbox').html('');
    for (i = 0; i < tp; i++ )
    $('.mbox').append('<span/>');
}