Question

我有一个从我的数据库中获取数字的脚本，我想要的是它的数字越大，显示的元素就越多。

让我们来看看代码：

 setInterval(function player(){
        $.ajax({ 
            type: "POST", 
            url: "url",
            datatype: 'json',
            success: function(data){
                var parsed_data = $.parseJSON(data);
                var number = parsed_data.number;
                    if(number >= 100) {
                      $('#element1').css('display','block'); 
                    }
                   if(number >= 1000) {
                       $('#element2').css('display','block');
                    }
            }
    });
    },1000);

Okey，所以这是我想要的第一步。但是我也想再删除它，因为现在如果我将数字提高到100它会显示element1（超级），但是如果我再次将数字降低到100以下它仍会显示。

我的.css

#element1, #element2 { display: none; }

那我在这里错过了什么？我也尝试过.setAttribute

提前致谢

Answer 1

你不需要if语句吗？

if(number <= 99) {
  $('#element').css('display','block'); 
}

或

else {
  $('#element').css('display','block'); 
}

然后是

#element { display: none; }

Answer 2

setInterval(function player(){
        $.ajax({ 
            type: "POST", 
            url: "url",
            datatype: 'json',
            success: function(data){
                var parsed_data = $.parseJSON(data);
                var number = parsed_data.number;
                if(number >= 100) {
                    $('#element1').css('display','block'); 
                } else if(number < 100) {
                    $('#element1').hide();
                }
                if(number >= 1000) {
                    $('#element2').css('display','block');
                } else if(number < 1000) {
                    $('#element2').hide();
                }
            }
        });
    },
1000);

唯一的事情是..我认为它必须是 if（number＆gt; = 1000＆amp;＆amp; number＆gt; = 100）{ - 不确定。

Answer 3

当dataType设置为json时，它会被jQuery自动解析，再次解析数据会产生解析错误：

setInterval(function() {
    $.ajax({
        type: "POST",
        url: "url",
        datatype: 'json'
    }).done(function (data) {
        var number = parseInt(data.number, 10);
        $('#element1').toggle(number >= 100);
        $('#element2').toggle(number >= 1000);
    });
}, 1000);

Answer 4

您应该隐藏所有元素并根据您的AJAX请求返回的数字再次显示它们。

success: function(data) {
  var parsed_data = $.parseJSON(data);
  var number = parsed_data.number;
  // hide all elements
  $("[id^='element']").hide();
  // show them again according to `number`
  if (number >= 100)  $('#element1').show();
  if (number >= 1000) $('#element2').show();
}

在更高的数字上显示元素

4 个答案: