ซีเลกเตอร์ button

ซีเลกเตอร์ :button เลือกองค์ประกอบที่เป็นปุ่มและ องค์ประกอบทั้งหมดที่มีประเภท button ดู แท็ก button, input ที่มีประเภท button เทียบเท่ากับ $(':button') คือ $('button'), $("input[type='button']") เนื่องจาก :button ไม่ได้อยู่ในข้อกำหนด CSS เพื่อประสิทธิภาพที่ดีขึ้นในเบราว์เซอร์สมัยใหม่ ควรกรององค์ประกอบด้วย การใช้ css-selector ล้วนก่อน แล้ว ค่อยใช้ .filter(':button')

ไวยากรณ์

นี่คือวิธีการเลือกปุ่ม:

javascript$(':button');

ตัวอย่าง

เรามาเลือกปุ่มทั้งหมดและทำให้พื้นหลังเป็นสีเขียวและ เส้นขอบสีแดง ตามทฤษฎีที่กล่าวมาข้างต้น โดยเพิ่มคลาส marked ด้วยเมธอด addClass:

html<form>
  <input type="button" value="button">
  <input type="file">
  <button>button</button>
  <input type="reset">
  <input type="radio">
  <input type="text">
</form>
css.marked {
  background-color: green;
  border: 2px red solid;
}
javascript$(':button').addClass('marked');

$('form').submit(function(event) {
  event.preventDefault(); // ป้องกันการส่งฟอร์ม
});

ดูเพิ่มเติม

  • แท็ก button
  • แท็ก input
  • เมธอด filter,
    ซึ่งกรององค์ประกอบในชุดตามซีเลกเตอร์ที่กำหนด
  • เมธอด addClass,
    ซึ่งเพิ่มคลาส CSS ที่กำหนดให้กับองค์ประกอบ