jquery เพื่อเปลี่ยนแอตทริบิวต์ style ของคลาส div


87

ฉันมีคลาสตัวเลื่อนแบบนี้และฉันต้องการเปลี่ยนสไตล์แอตทริบิวต์style = "left: 336px"

<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>

ฉันลอง $('.handle').css({'style':'left: 300px'})แล้วแต่มันไม่ได้ผล ไม่แน่ใจว่าฉันทำอะไรผิดที่นี่

คำตอบ:



84

หากคุณต้องการตั้งค่าการใช้คุณลักษณะสไตล์

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

หรือคุณสามารถใช้เมธอด css ของ jQuery เพื่อตั้งค่าคุณสมบัติสไตล์ css เพียงรายการเดียว

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

หรือเหมือนกับค่าคีย์

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

ข้อมูลเพิ่มเติมเกี่ยวกับ W3schools


2
นี่เป็นคำตอบที่สมบูรณ์และดีกว่าที่เลือกไว้
Nicola Pedretti

$('.handle').prop('style','left: 300px');ทำงานด้วย
Nurkartiko

8

ลองด้วย

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

แทน

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

@dev อัปเดตตอนนี้ตรวจสอบว่าใช้งานได้แน่นอนฉันลบวงเล็บออกโดยไม่ได้ตั้งใจ
Raghuveer




2

สไตล์เป็นแอตทริบิวต์ดังนั้นcssจะใช้ไม่ได้กับมันคุณสามารถใช้ได้attr

เปลี่ยน:

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

T0:

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

2

คุณไม่สามารถใช้ $('#Id').attr('style',' color:red'); และ $('#Id').css('padding-left','20%');
ในเวลาเดียวกัน
คุณสามารถใช้attr หรือ ใช้งานได้cssเฉพาะเมื่อใช้เพียงอย่างเดียว

โดยการใช้ไซต์ของเรา หมายความว่าคุณได้อ่านและทำความเข้าใจนโยบายคุกกี้และนโยบายความเป็นส่วนตัวของเราแล้ว
Licensed under cc by-sa 3.0 with attribution required.