Computer >> บทช่วยสอนคอมพิวเตอร์ >  >> การเขียนโปรแกรม >> JavaScript

ความหมายของ JavaScript void(0)

ตัวดำเนินการ void ใช้ประเมินนิพจน์ที่กำหนด แล้วคืนค่า undefined เสมอ ใช้ void(0) เพื่อให้ได้ค่า primitive undefined

หากการแทรกนิพจน์ในหน้าเว็บทำให้เกิดผลลัพธ์ไม่พึงประสงค์ (เช่น navigate ไป URL ใหม่) ใช้ javascript:void(0) เพื่อป้องกัน

กรณีใช้งานทั่วไป

ในแท็ก <a> ที่ไม่ต้องการให้นำทาง (navigate) ไปไหน:

<a href="javascript:void(0);" onclick="doSomething();">Click me</a>

หากใช้ href="#" จะเลื่อนหน้าขึ้นบนสุด ใช้ javascript:void(0) ป้องกันพฤติกรรมนี้

ตัวอย่าง: ป้องกันการโหลดหน้าใหม่

<html>
  <head>
    <script>
      function handleClick() {
        alert("Button clicked!");
      }
    </script>
  </head>
  <body>
    <!-- คลิกครั้งแรก: ไม่ reload, แค่ alert -->
    <a href="javascript:void(0);" ondblclick="handleClick();">
      Double-click me
    </a>
  </body>
</html>

รายละเอียด

  • void(0), void 0, void(undefined) ทั้งหมดคืน undefined
  • ไม่ได้ "บล็อก" JavaScript แต่ทำให้นิพจน์ไม่คืนค่าอะไรเลย
  • ใน ES6+ ควรใช้ <button> แทน <a> สำหรับ action ที่ไม่ navigate

แนวทางทันสมัย (Modern Alternative)

<!-- ดีกว่า: ใช้ button สำหรับ action -->
<button type="button" onclick="doSomething();">Click me</button>

<!-- หรือ preventDefault -->
<a href="#" onclick="event.preventDefault(); doSomething();">Link</a>