div sınıfının stil özniteliğini değiştirmek için jquery


87

Bunun gibi bir kaydırıcı sınıfım var ve style = "left: 336px" stil özelliğini değiştirmek istiyorum

<div id="range-cont">
<div class="slider">
<div class="progress" style="width: 350px;"></div>
    <a class="handle" href="#" **style="left: 336px;"**></a>
</div>
<input id="percentage" class="range" type="range" value="14" name="percentage" min="0" max="100">
<p id="percent-label">%</p>
</div>
</div>

Denedim $('.handle').css({'style':'left: 300px'})ama çalışmıyor. Burada neyi yanlış yaptığımdan emin değilim

Yanıtlar:



84

sadece stil özelliğini ayarlamak istiyorsanız

$('.handle').attr('style','left: 300px');

Veya sadece bir css stili özelliğini ayarlamak için jQuery'nin css yöntemini kullanabilirsiniz.

$('.handle').css('left', '300px');

VEYA anahtar değeriyle aynı

$('.handle').css({'left': '300px', position});

W3schools hakkında daha fazla bilgi



$('.handle').prop('style','left: 300px');o da çalışıyor
Nurkartiko

8

İle deneyin

$('.handle').css({'left': '300px'});

Onun yerine

$('.handle').css({'style':'left: 300px'})

@dev şimdi güncellendi, emin olup olmadığını kontrol edin, yanlışlıkla parantezleri kaldırdım
Raghuveer

7
$('.handle').css('left', '300px');

$('.handle').css({
    left : '300px'
});

$('.handle').attr('style', 'left : 300px');

veya OrnaJS kullanın



2

bu sizin için yararlıdır ..

$('.handle').css('left', '300px');

2

Stil bir niteliktir, bu yüzden cssonun için çalışmaz.attr

Değişiklik:

$('.handle').css({'style':'left: 300px'});

T0:

$('.handle').attr('style','left: 300px');//Use `,` Comma instead of `:` colon

2

$('#Id').attr('style',' color:red'); Ve $('#Id').css('padding-left','20%');
aynı anda kullanamazsınız .
Ya kullanabilirsiniz attr veya css ancak tek başına kullanıldığında hem çalışır.


0

Sınıfın niteliğini koşullu olarak değiştirmek için,

var css_val = $(".handle").css('left');
if(css_val == '336px')
{
  $(".handle").css('left','300px');
}

İd aşağıdaki gibi verilmiş ise,

<a id="handle" class="handle" href="#" style="left: 336px;"></a>

İşte alternatif bir çözüm:

var css_val = $("#handle").css('left');
if(css_val == '336px')
{
  $("#handle").css('left','300px');
}
Sitemizi kullandığınızda şunları okuyup anladığınızı kabul etmiş olursunuz: Çerez Politikası ve Gizlilik Politikası.
Licensed under cc by-sa 3.0 with attribution required.