นิพจน์ href <a href= การแก้ไขavascript:; ”> </a> ทำอะไร

228

ฉันได้เห็น href ต่อไปนี้ที่ใช้ในหน้าเว็บเป็นครั้งคราว อย่างไรก็ตามฉันไม่เข้าใจว่าสิ่งนี้กำลังพยายามทำหรือเทคนิค ใครบางคนสามารถอธิบายรายละเอียดได้โปรด?

<a href="javascript:;"></a>

javascript

— จอห์นลิเวอร์มอร์
แหล่งที่มา

2

คุณสามารถเรียกใช้เมธอด JS ด้วยวิธีนี้หากฉันไม่เข้าใจผิด .. javascript: SomeFunction ()

— Rob

1

ไม่ใช่การพยายามทำอะไรที่ไม่สามารถจัดการได้ด้วยตัวจัดการการคลิกที่เหมาะสม คุณควรหลีกเลี่ยงสิ่งนี้เพราะมันน่าเกลียดไม่สามารถเข้าถึงได้และทำให้คนใช้javascript:รูปแบบที่ไม่ควรใช้ ( onclick="javascript:…")

— Gareth

2

ลองดูสิ: stackoverflow.com/a/138233/908879

— ajax333221

247

<a>องค์ประกอบ HTML ที่ไม่ถูกต้องเว้นแต่จะมีอย่างใดอย่างหนึ่งhrefหรือnameแอตทริบิวต์

หากคุณต้องการให้แสดงผลอย่างถูกต้องเป็นลิงก์ (เช่นขีดเส้นใต้ตัวชี้มือ ฯลฯ ) จากนั้นจะทำเช่นนั้นหากมี hrefแอตทริบิวต์

บางครั้งรหัสเช่นนี้จึงใช้เป็นวิธีในการสร้างลิงก์ แต่ไม่จำเป็นต้องระบุ URL จริงใน hrefแอตทริบิวต์ ผู้พัฒนาต้องการให้ลิงก์ไม่ทำอะไรเลยและนี่เป็นวิธีที่ง่ายที่สุดที่เขารู้

เขาอาจมีรหัสเหตุการณ์ javascript ที่อื่นซึ่งถูกเรียกใช้เมื่อมีการคลิกลิงก์และนั่นจะเป็นสิ่งที่เขาต้องการจะเกิดขึ้นจริง แต่เขาต้องการให้มันดูเหมือนปกติ <a>ลิงค์แท็ก

นักพัฒนาบางคนใช้href='#'เพื่อจุดประสงค์เดียวกัน แต่สิ่งนี้ทำให้เบราว์เซอร์ข้ามไปที่ด้านบนของหน้าซึ่งอาจไม่ต้องการ และเขาไม่สามารถปล่อยให้ว่างเปล่าได้เพราะhref=''มันเป็นลิงค์กลับไปที่หน้าปัจจุบัน (เช่นมันทำให้เกิดการรีเฟรชหน้า)

มีวิธีแก้ไขสิ่งต่าง ๆ เหล่านี้ การใช้โค้ด Javascript ที่ว่างเปล่าในนั้นhrefเป็นหนึ่งในนั้นและแม้ว่าจะไม่ใช่วิธีที่ดีที่สุด แต่ก็ใช้งานได้

— Spudley
แหล่งที่มา

16

จากความอยากรู้มีวิธีที่ดีกว่าในการทำเช่นนี้?

— Rahman Kalfane

28

สิ่งที่ดีกว่าคือการทำเช่นนี้ถ้าฟังก์ชั่นเหตุการณ์ทำreturn false;หรือevent.preventDefault()การhrefกระทำนั้นจะไม่ถูกเรียกดังนั้นคุณสามารถใส่สิ่งที่สมเหตุสมผลได้

— Spudley

6

<a>โดยไม่ต้องhrefหรือnameไม่ถูกต้อง สามารถตรวจสอบได้อย่างง่ายดายโดยใช้ตัวตรวจสอบความถูกต้อง

— Jukka K. Korpela

2

แฟรกเมนต์ (# section) ไม่ควรถูกส่งไปยังเว็บเซิร์ฟเวอร์ตามข้อมูลจำเพาะดังนั้นโอกาสที่เบราว์เซอร์ของคุณจะทำสิ่งผิดปกติ

— Joshua Walsh

2

ใช่สิ่งที่ @YoshieMaster พูด หาก URL มี# แฟรกเมนต์นั่นจะไม่ถูกส่งไปยังเว็บเซิร์ฟเวอร์ (หรือดังนั้นไปยังไฟร์วอลล์) มันถูกใช้ภายในโดยเบราว์เซอร์เท่านั้น ในกรณีนี้การคลิกลิงก์ที่ติดแท็กด้วย<a href="#">... </a>จะไม่ทำให้เบราว์เซอร์ของคุณส่งคำขอ HTTP ใด ๆ สิ่งที่มันจะทำคือเลื่อนไปที่ด้านบนของหน้า

— Mark Reed

38

โดยทั่วไปแทนที่จะใช้ลิงก์เพื่อย้ายหน้า (หรือจุดยึด) การใช้วิธีนี้จะเปิดใช้งานฟังก์ชันจาวาสคริปต์

<script>
function doSomething() {
  alert("hello")
}
</script>
<a href="javascript:doSomething();">click me</a>

การคลิกที่ลิงก์จะเริ่มการแจ้งเตือน

— Eonasdan
แหล่งที่มา

31

มีกลไกหลายอย่างที่จะหลีกเลี่ยงการเชื่อมโยงไปถึงปลายทาง หนึ่งในคำถามนั้นไม่ง่ายนัก

ตัวเลือกที่สะอาดกว่าคือการใช้href="#no"ที่ไหน#noจุดยึดที่ไม่ได้กำหนดไว้ในเอกสาร

คุณสามารถใช้ชื่อ semantic เพิ่มเติมเช่น #disable หรือ #action เพื่อเพิ่มความสามารถในการอ่าน

ประโยชน์ของวิธีการ:

หลีกเลี่ยงผลกระทบ "ที่ย้ายไปด้านบน" ของ href = "#"
หลีกเลี่ยงการใช้งานจาวาสคริปต์

ข้อเสีย:

คุณต้องแน่ใจว่าไม่ได้ใช้ชื่อจุดยึดในเอกสาร

เนื่องจาก<a>องค์ประกอบไม่ได้ทำหน้าที่เป็นลิงก์ตัวเลือกที่ดีที่สุดในกรณีนี้คือไม่ได้ใช้<a>องค์ประกอบ แต่เป็น<div>และให้ลักษณะคล้ายลิงก์ที่ต้องการ

— โปเกอร์เนอร์
แหล่งที่มา

13

ฉันชอบสมอเรือที่ไม่ได้กำหนดเช่นกัน อย่างไรก็ตามข้อเสียอีกอย่างคือมันเพิ่มจุดยึดในประวัติเบราว์เซอร์ของคุณดังนั้นฉันเลือกที่จะใช้วิธีการ JS เปล่าใน OP

— John Reid

10

<a href="javascript:alert('Hello');"></a>

เป็นเพียงชวเลขสำหรับ:

<a href="" onclick="alert('Hello'); return false;"></a>

— bjornd
แหล่งที่มา

3

ชนิดของ แต่ไม่ใช่การเปรียบเทียบแบบ "ถูกใจอย่าง" ซึ่งเป็นเหตุผลที่บางคนตกหลุมพรางของการใช้มันตั้งแต่แรก

— Lankymart

9

มันเป็นวิธีในการสร้างลิงก์ที่ไม่ทำอะไรเลยเมื่อคลิก (ยกเว้นกรณีที่จาวาสคริปต์ผูกไว้กับมัน)

มันเป็นวิธีการใช้งาน Javascript แทนที่จะไปตามลิงค์:

<a href="Javascript: doStuff();">link</a>

เมื่อไม่มีจาวาสคริปต์จริงๆให้เรียกใช้ (เช่นตัวอย่างของคุณ) มันไม่ทำอะไรเลย

— Daan Wilmer
แหล่งที่มา

อ่าฉันเข้าใจแล้ว มันปิดการใช้งานลิงค์ได้อย่างมีประสิทธิภาพ

— John Livermore

9

อ้างถึงสิ่งนี้:

<a href="Http://WWW.stackoverflow.com">Link to the website opened in different tab</a>
<a href="#MyDive">Link to the div in the page(look at the chaneged url)</a>
<a href="javascript:;">Nothing happens if there is no javaScript to render</a>

— bk
แหล่งที่มา

4

<a href="javascript:void(0);"></a>

javascript: บอกเบราว์เซอร์ว่าจะเขียนโค้ดจาวาสคริปต์

— Gowri
แหล่งที่มา

3

เธรดเก่า แต่คิดว่าฉันแค่เพิ่มว่าเหตุผลที่นักพัฒนาใช้โครงสร้างนี้ไม่ได้สร้างลิงก์ตาย แต่เพราะ URL จาวาสคริปต์ด้วยเหตุผลบางอย่างไม่ผ่านการอ้างอิงถึงองค์ประกอบ HTML ที่ใช้งานได้อย่างถูกต้อง

เช่นใช้handler_function(this.id)งานonClickได้ แต่ไม่ใช่ในรูปแบบจาวาสคริปต์

ดังนั้นจึงเป็นทางเลือกระหว่างการเขียนรหัสที่สอดคล้องกับมาตรฐานที่เกี่ยวข้องกับคุณในการปรับการโทรสำหรับแต่ละไฮเปอร์ลิงก์หรือโค้ดที่ไม่ได้มาตรฐานเล็กน้อยซึ่งสามารถเขียนได้ครั้งเดียวและใช้ทุกที่

2

ดังนั้นมันจึงใช้ในการเขียนรหัส js ภายในhrefแทนที่จะเป็นฟังเหตุการณ์ชอบonclickและหลีกเลี่ยงการ#เชื่อมโยงในhrefการทำให้aแท็กที่ถูกต้องสำหรับ html

ฉันมีการวิจัยเกี่ยวกับวิธีใช้javascript:ภายในของhrefแอตทริบิวต์

<a href="
     javascript:
        a = 4;
        console.log(a++); 
        a += 2; 
        console.log(a++); 
        if(a < 6){ 
            console.log('a is lower than 6');
        } 
        else 
            console.log('a is greater than 6');
        function log(s){
            console.log(s);
        }
        log('function inplimentation working too');

">Click here</a>

ผ่านรหัสนี้คุณสามารถเขียนรหัส js ที่นั่นแทนฟังก์ชั่นการโทรเท่านั้น

ทดสอบใน chrome รุ่น 68.0.3440.106 (รุ่นทางการ) (64 บิต)

ทดสอบใน Firefox Quantom 61.0.1 (64-bit)

— Amir Fo
แหล่งที่มา

-4

วิธีที่ดีที่สุดในการเรนเดอร์ลิงก์อย่างถูกต้องอยู่เสมอกับ css ดังนี้:

a {cursor: pointer !important}

ควรหลีกเลี่ยงการทำสิ่งที่ไม่จำเป็นเช่นที่กล่าวไว้ในเธรด

— Imran Nazir
แหล่งที่มา