Question

所以我正在尝试为我的网站建立这个信誉栏，这完全取决于给定的数字。功能应该是这样的。

如果div的值为1-10，则添加class="beginner" 如果div的值为11-20，则添加class="mediocre" 如果div的值为21-30，请添加class="hardcore" 等等..

我有这个：

<div><a>7</a></div>

我想要的是：

<div class="beginner"><a>7</a></div>

我认为我应该从这样的事情开始：

$("div:contains('0>10')").addClass("begginer");

但我非常确定这不起作用。谁能帮我这个？我迷失在这里:(

Answer 1

只需使用.filter()：

$('div').filter(function() {
  var number = parseInt($(this).text(), 10);

  return (number >= 1) && (number <= 10);
}).addClass("beginner");

Answer 2

(function() {
    var cssClasses = ['beginner','mediocre','hardcore','genius','mad-wizard'];
    $('div').each(function(){
        var index = $(this).find('a').text();
        index = (index.length === 1) ? index = '0' : index = index.substr(0,1);
        $(this).addClass( cssClasses[parseInt(index)] );
    });
})();

// weird i know
// this is assuming you don't go past 2 digits in value

// this is wrong, its doing 0-9, 10-19, 20-21   sorry

Answer 3

<强> jsBin demo

var rated = $('div a');                  // SET YOUR 'numbers' source
var r = parseInt( rated.text(), 10 );    // parse integers with radix
var rate = 'beginner';                   // SET INITIAL RATE

  if ((r > 10) && (r <= 20)) { rate = 'mediocre'; }
  if ((r > 20) && (r <= 30)) { rate = 'hardcore'; } 

rated.addClass(rate);                    // FINALLY ADDCLASS TO ELEMENT

Answer 4

我相信你会找到自定义代码来解决这个问题。一个例子是：

$("div").addClass(function(index,currentClass) {
    var value = parseInt($(this).children("a").text(), 10);
    if ( value <= 10 )
        return 'beginner'
    if ( value <= 20 )
        ...
});

Answer 5

我会做一个匹配的if语句。

var val = parseInt( $('div').text() );
if ( val  <= 10 ) {
    // ...
} else if ( val <= 20 ) {
    // ...
}

如果您想为一组<div>执行此操作，则可以使用

$('div').each(function () {
    var val = parseInt( $(this).text() );
    // ...

Jquery如果div有value1-10添加类

5 个答案: