01/10/2018, 00:32
Cho mình hỏi cách làm việc của sự kiện onsubmit trong Javascript?
MÌnh thấy sự kiện onsubmit làm việc hơi khác biệt một chút. Theo mình hiểu thì sự kiện này kích hoạt khi ta nhấn nút submit để gửi dữ liệu. Nhưng nó hoạt động khác sự kiện onclick. Vậy mong các bạn có thể giải thích chi tiết giúp mình cách hoạt động của sự kiên onsubmit. Cám ơn!
Code:
Html
<form action="" name="myForm" onsubmit="return(hienthi());"/> <input type="text" name="ip1"/> <input type="submit" value="submit"/> </form>
javascript:
function hienthi() { if(document.myForm.ip1.value == "") { alert("Yeu cau nhap du lieu:"); document.myForm.ip1.focus(); return false; } }
Tại sao onsubmit=“return(hienthi());” mà không phải onsubmit=“hienthi()”;
Tại sao trong function hienthi lại phải là return false.
Nếu không chương trình sẽ thoát ra khỏi hàm.
Mong được biết chi tiết cách làm việc của onsubmit. Cám ơn các bạn!
Bài liên quan
Câu hỏi khá hay dành cho các bạn yêu mến JS:
Mặc định form sẽ có thêm 1 thẻ action="", đây chính là logic mặc định của browser khi submit form. Hàm hienthi() của bạn đang kiểm tra (validation) nên nếu lỗi thì không dùng action mặc định của browser nữa. Do đó, phải return false để thông báo cho browser. Nếu return true, nó sẽ submit.
onsubmit sẽ bằng return(false) nếu bị lỗi. Nếu chỉ có obsubmit=“hienthi()” thì thực ra nó vẫn submit dù có return false (code implement của onsubmit ở browser trả về true/false). Nếu muốn ngăn mặc định, bạn phải truyền event vào và gọi event.preventDefault(). hoặc sử dụng return (false) như phía trên.
Còn onclick không cần phải như obsubmit vì bản thân hàm onclick tác động lên 1 element và không redirect sang action cần xử lý, do đó source của onclick không trả về true/false. Khi đó trong handler xử lý, bạn chỉ cần gọi return false, hoặc e.preventDefault là đủ.
Có vẻ như return(false) ở onsubmit hơi lằng nhắng các bạn nhỉ. Nếu chỉ là false thôi mình nghĩ cũng đc vì action căn cứ vào giá trị của onsubmit!
Bạn có thể đọc thêm code được implement của Firefox ở đây:
http://hg.mozilla.org/releases/mozilla-1.9.2/file/tip/content/base/src/nsDocument.cpp
Cái này do W3C qui định rồi, nên buộc phải implement như thế. Bạn cảm thấy k ok, thì submit 1 request lên W3C. ^^
Cám ơn các bạn. Mình nghĩ là có lý do cả tại mình chưa khám phá ra thôi