วิธีตั้งค่ารูปแบบเคอร์เซอร์เป็นตัวชี้สำหรับลิงก์ที่ไม่มี hrefs

ฉันมี<a>แท็ก html จำนวนมากที่ไม่มีhrefแอตทริบิวต์สำหรับการonclickเรียกใช้จาวาสคริปต์ ลิงก์เหล่านี้ไม่มีรูปแบบตัวชี้ของเคอร์เซอร์ มีเคอร์เซอร์รูปแบบข้อความ

ฉันจะตั้งค่ารูปแบบเคอร์เซอร์เป็นตัวชี้สำหรับลิงก์โดยไม่ใช้hrefแอตทริบิวต์ได้อย่างไร

ฉันรู้ว่าฉันสามารถเพิ่ม href = "#" ได้ ฉันมีสิ่งนี้ในหลาย ๆ ที่ในเอกสาร html และต้องการทราบวิธีสร้างตัวชี้รูปแบบเคอร์เซอร์สำหรับลิงก์โดยไม่ต้องใช้hrefแอตทริบิวต์

ในไฟล์ css ของคุณเพิ่มสิ่งนี้ ....

a:hover {
 cursor:pointer;
}

หากคุณไม่มีไฟล์ css ให้เพิ่มไฟล์นี้ที่ HEAD ของหน้า HTML ของคุณ

<style type="text/css">
 a:hover {
  cursor:pointer;
 }
</style>

นอกจากนี้คุณสามารถใช้แอตทริบิวต์ href = "" โดยส่งคืนเท็จที่ส่วนท้ายของจาวาสคริปต์ของคุณ

<a href="" onclick="doSomething(); return false;">a link</a>

นี่เป็นสิ่งที่ดีสำหรับหลาย ๆ เหตุผล SEO หรือถ้าใครไม่มี javascript href = "" ก็ใช้ได้ เช่น

<a href="nojavascriptpage.html" onclick="doSomething(); return false;">a link</a>

@ ดู http://www.alistapart.com/articles/behavioralseparation

แก้ไข: น่าสังเกตคำตอบของ @ BalusC ที่เขากล่าวว่า:hoverไม่จำเป็นสำหรับกรณีการใช้งานของ OP แม้ว่าสไตล์อื่น ๆ สามารถเพิ่มได้ด้วย:hoverตัวเลือก

เพียงเพิ่มสิ่งนี้ในสไตล์ CSS ส่วนกลางของคุณ:

a { cursor: pointer; }

วิธีนี้จะทำให้คุณไม่ต้องพึ่งพารูปแบบเคอร์เซอร์เริ่มต้นของเบราว์เซอร์อีกต่อไป

style = "cursor: pointer;"

นี่คือวิธีการเปลี่ยนเคอร์เซอร์จากลูกศรเป็นมือเมื่อคุณวางเมาส์เหนือสิ่งที่กำหนดobject(myObject)

myObject.style.cursor = 'pointer';

ใช้ CSS นะcursor: pointerถ้าจำไม่ผิด

ในไฟล์ CSS ของคุณ:

.link_cursor
{
    cursor: pointer;
}

จากนั้นเพิ่ม HTML ต่อไปนี้ให้กับองค์ประกอบใด ๆ ที่คุณต้องการให้มีเคอร์เซอร์ลิงก์: class="link_cursor"(วิธีที่ต้องการ)

หรือใช้ CSS แบบอินไลน์:

<a style="cursor: pointer;">

ให้คลาสทั่วไป (เช่นลิงค์อินสแตนซ์) จากนั้นเพิ่มในไฟล์ css:

.link { cursor: pointer; }

หรือตามที่ @mxmissile แนะนำให้ทำแบบอินไลน์ด้วย style = "cursor: pointer;"

สร้างคลาสด้วย CSS ต่อไปนี้และเพิ่มลงในแท็กของคุณด้วยเหตุการณ์ onclick:

cursor:pointer;

รุ่นเชิงมุม:

<a (click)="action(); $event.preventDefault()" href="#">Action</a>

สิ่งนี้ใช้ได้ผลสำหรับฉัน:

<a onClick={this.openPopupbox} style={{cursor: 'pointer'}}>