Devdit
 

PHP คลิกแล้วปุ่มเปลี่ยนสี ด้วยการกำหนด backgroundColor

2.8K

กรณีสร้างเว็บไซต์ด้วยภาษา PHP แล้วต้องการให้เมื่อผู้ใช้งานคลิกที่ลิงก์แล้วปุ่มเปลี่ยนสี แนะนำให้ใช้ภาษา JavaScript โดยการเพิ่ม style ในส่วนของสีพื้นหลังของปุ่มด้วย backgroundColor สามารถเขียนโปรแกรมได้ดังนี้

 

ตัวอย่าง PHP คลิกแล้วปุ่มเปลี่ยนสี ด้วยการกำหนด backgroundColor

<input type="button" value="ปุ่มกด" id="btn">
<br/>
<a href="javascript:changeColor('red');">สีแดง</a> | 
<a href="javascript:changeColor('green');">สีเขียว</a> | 
<a href="javascript:changeColor('blue');">สีฟ้า</a>
<script>
    function changeColor( color ) {
        var e = document.getElementById("btn");
        e.style.removeProperty("backgroundColor");
        e.style.backgroundColor = color;
    }
</script>

คำอธิบาย

1. เมื่อผู้ใช้งานกดลิงก์ที่หน้าเว็บไซต์ จะเรียกใช้ฟังก์ชัน changeColor ในภาษา JavaScript โดยส่งค่าไปตามแต่ละสีที่กดเลือก

2. ภายในฟังก์ชัน changeColor จะรับตัวแปร color เข้ามา และมีการอ้างอิงปุ่มด้วย id = btn

3. ลบสีเดิมออกด้วยคำสั่ง removeProperty("backgroundColor")

4. เปลี่ยนสีปุ่ม ให้เป็นไปตามสีที่กดคลิก ด้วยคำสั่ง backgroundColor = color

เขียน 2 ปีที่แล้ว
ชอบ
ลิ้งก์
แชร์
Devdit มีช่อง YouTube แล้ว
เราสร้างวิดีโอเกี่ยวกับเทคโนโลยี ทำตามง่ายๆ