ใช้ลิงก์ปกติเพื่อส่งแบบฟอร์ม

ฉันต้องการส่งแบบฟอร์ม แต่ฉันไม่ได้ใช้วิธีพื้นฐานในการใช้ปุ่มป้อนข้อมูลกับประเภทการส่ง แต่เป็นลิงก์

ภาพด้านล่างแสดงสาเหตุ ฉันใช้ลิงก์รูปภาพเพื่อบันทึก / ส่งแบบฟอร์ม เนื่องจากฉันมีมาร์กอัป css มาตรฐานสำหรับลิงก์รูปภาพฉันไม่ต้องการใช้ปุ่มส่งอินพุต

ฉันพยายามใช้onClick = "document.formName.submit ()"กับองค์ประกอบ แต่ฉันต้องการวิธี html

ความคิดใด ๆ ?

สองทาง. ทั้งสร้างปุ่มและรูปแบบมันจึงดูเหมือนว่าการเชื่อมโยงกับ CSS onclick="this.closest('form').submit();return false;"หรือสร้างการเชื่อมโยงและการใช้งาน

คุณไม่สามารถทำได้จริง ๆ หากไม่มีการเขียนสคริปต์บางรูปแบบเพื่อความรู้ที่ดีที่สุดของฉัน

<form id="my_form">
<!-- Your Form -->    
<a href="javascript:{}" onclick="document.getElementById('my_form').submit(); return false;">submit</a>
</form>

ตัวอย่างจากที่นี่

แค่จัดแต่งทรงผมinput type="submit"แบบนี้ก็ได้ผลสำหรับฉัน:

.link-button { 
     background: none;
     border: none;
     color: #0066ff;
     text-decoration: underline;
     cursor: pointer; 
}

<input type="submit" class="link-button" />

ทดสอบใน Chrome, IE 7-9, Firefox

คุณกำลังใช้รูปภาพในการส่ง .. ดังนั้นคุณสามารถใช้type="image""ปุ่ม" อินพุต:

<input type="image" src="yourimage.png" name="yourinputname" value="yourinputvalue" />

ใช้:

<input type="image" src=".."/>

หรือ:

<button type="send"><img src=".."/> + any html code</button>

บวก CSS

แน่นอนว่าไม่มีวิธีแก้ปัญหาด้วย HTML ที่บริสุทธิ์ในการส่งแบบฟอร์มที่มีaแท็กlink ( ) HTML มาตรฐานยอมรับเฉพาะปุ่มหรือรูปภาพ ดังที่ผู้ทำงานร่วมกันคนอื่น ๆ กล่าวไว้เราสามารถจำลองลักษณะที่ปรากฏของลิงก์ได้โดยใช้ปุ่ม แต่ฉันเดาว่านั่นไม่ใช่จุดประสงค์ของคำถาม

IMHO ฉันเชื่อว่าโซลูชันที่เสนอและได้รับการยอมรับไม่ได้ผล

ฉันได้ทดสอบในแบบฟอร์มและเบราว์เซอร์ไม่พบข้อมูลอ้างอิงของแบบฟอร์ม

ดังนั้นจึงเป็นไปได้ที่จะแก้ปัญหาโดยใช้ JavaScript บรรทัดเดียวโดยใช้thisobject ซึ่งอ้างอิงถึงองค์ประกอบที่คลิกซึ่งเป็นโหนดลูกของฟอร์มที่ต้องส่ง ดังนั้นthis.parentNodeเป็นโหนดแบบฟอร์ม หลังจากนั้นก็เรียกsubmit()วิธีการในรูปแบบนั้น ไม่จำเป็นต้องค้นคว้าจากเอกสารทั้งหมดเพื่อค้นหาแบบฟอร์มที่เหมาะสม

<form action="http://www.greatsolutions.com.br/indexint.htm"                   
   method="get">
    <h3> Enter your name</h3>
    First Name <input type="text"  name="fname"  size="30"><br>
    Last Name <input type="text" name="lname" size="30"><br>
    <a href="#" onclick="this.parentNode.submit();"> Submit here</a>
</form>

สมมติว่าฉันป้อนด้วยชื่อของฉันเอง:

ฉันใช้getในแอตทริบิวต์ form method เนื่องจากสามารถดูพารามิเตอร์ที่ถูกต้องใน URL ที่หน้าที่โหลดหลังจากส่ง

http://www.greatsolutions.com.br/indexint.htm?fname=Paulo&lname=Buchsbaum

เห็นได้ชัดว่าโซลูชันนี้ใช้กับแท็กใด ๆ ที่ยอมรับonclickเหตุการณ์หรือเหตุการณ์ที่คล้ายกัน

thisเป็นตัวเลือกที่ยอดเยี่ยมในการกู้คืนบริบทพร้อมกับeventตัวแปร (มีให้ใช้งานในเบราว์เซอร์หลักทั้งหมดและ IE9 เป็นต้นไป) ที่สามารถใช้โดยตรงหรือส่งผ่านเป็นอาร์กิวเมนต์ไปยังฟังก์ชัน

ในกรณีนี้ให้แทนที่บรรทัดด้วยaแท็กตามบรรทัดด้านล่างโดยใช้คุณสมบัติtargetที่ระบุองค์ประกอบที่เริ่มต้นเหตุการณ์

<a href="#" onclick="event.target.parentNode.submit();"> Submit here</a>

คุณสามารถใช้ OnClick = "document.getElementById ('formID_NOT_NAME') SUBMIT ()"