Tắt hoặc Bật nút Gửi bằng cách sử dụng Thuộc tính bị vô hiệu hóa JavaScript – cách tắt nút gửi

Ở đây trong bài đăng này, tôi đã chia sẻ một ví dụ đơn giản cho thấy cách tắt hoặc bật nút gửi dựa trên một số điều kiện nhất định.

Bạn đang xem : cách tắt nút gửi

Bạn có thể sử dụng thuộc tính JavaScript

đã tắt

để tắt hoặc bật nút gửi hoặc nút nhập trên trang web của mình. Trong bài đăng này, tôi đang chia sẻ một ví dụ đơn giản về cách tắt hoặc bật nút gửi dựa trên một số điều kiện nhất định.

Cú pháp

submitObject.disabled

Thuộc tính bị vô hiệu hóa JavaScript là thuộc tính boolean có giá trị true hoặc false. Đặt thuộc tính thành true sẽ kích hoạt nút (có thể nhấp) và đặt thuộc tính false (như bt.disabled = false;) sẽ tắt nút (không thể nhấp).

Bài đăng có Liên quan:

Đây là những gì tôi đang làm. Tôi có hai yếu tố trên trang web của mình. Một hộp văn bản và một nút gửi. Theo mặc định, nút gửi vẫn bị vô hiệu hóa. Tôi sẽ sử dụng thuộc tính đã tắt của Phần tử đầu vào để đặt nó bị vô hiệu hóa (hoặc không thể nhấp). Khi người dùng nhập một giá trị vào hộp văn bản, tập lệnh sẽ bật (có thể nhấp) vào nút gửi, nếu không, nếu hộp văn bản trống, nó sẽ lại vô hiệu hóa nút.

Đánh dấu và Tập lệnh

& amp; lthtml & gt;
& amp; ltbody & gt;
    & amp; ltinput type = "text" id = "txt" 

onkeyup

= "management (this)" / & gt; & amp; ltinput type = "submit" id = "btSubmit"

bị vô hiệu hóa

/ & gt; & amp; lt / body & gt; & amp; ltscript & gt; chức năng quản lý (txt) { var bt = document.

getElementById

('btSubmit'); if (txt.value! = '') { bt.

bị vô hiệu

= false; } khác { bt.

bị vô hiệu hóa

= true; } } & amp; lt / script & gt; & amp; lt / html & gt;

Hãy thử

Xem Thêm  Trang cá nhân TungDominico - unity3d là gì

Bạn có thể áp dụng cùng một tập lệnh (ở trên) trên nút Loại phần tử đầu vào. Ví dụ:

& amp; ltinput 

type = "button"

id = "btSubmit" value = "Gửi"

bị vô hiệu

/ & gt;

Tập lệnh tương tự sẽ hoạt động với nút gửi cũng như bằng nút đầu vào.

Cũng nên đọc:

Tắt hoặc Bật Nút Gửi trên Nhiều Hộp Văn bản

Bạn có thể áp dụng phương pháp trên trên biểu mẫu có nhiều hộp văn bản, tức là bạn có thể tắt hoặc bật nút gửi sau khi đảm bảo rằng tất cả các trường (đầu vào) đều có giá trị.

Tôi sẽ sử dụng thuộc tính đã tắt JavaScript trong tập lệnh, bên trong một vòng lặp kiểm tra loại trường đầu vào và sau khi kiểm tra các trường có giá trị.

Bài viết liên quan:

Bây giờ, tôi có hai hộp nhập để gọi một hàm bằng sự kiện onchange.

& amp; lthtml & gt;
& amp; lthead & gt;
    & amp; lttitle & gt; Bật / Tắt Nút Gửi dựa trên Nhiều giá trị Hộp văn bản & amp; lt / title & gt;
& amp; lt / head & gt;
& amp; ltbody & gt;
    & amp; ltp & gt; Nhập một số giá trị vào văn bản để Bật nút Gửi! & amp; lt / p & gt;

    & amp; ltp & gt; Tên: & amp; ltinput type = "text" id = "name" placeholder = "Nhập tên của bạn"
        

onkeyup

= "management (this)" / & gt; & amp; lt / p & gt; Chỉ định: & amp; ltinput type = "text" id = "Desig" placeholder = "Nhập chỉ định"

onkeyup

= "management (this)" / & gt; & amp; ltinput type = "submit" id = "submit"

bị vô hiệu hóa

/ & gt; & amp; lt / body & gt; & amp; ltscript & gt; chức năng quản lý (txt) { var bt = document.

getElementById

('submit'); var ele = document.

getElementsByTagName

('input'); for (i = 0; i & lt; ele.length; i ++) { if (ele [i] .type == 'text' & amp; & amp; ele [i] .value == '') { bt.

bị vô hiệu hóa

= true; trả về sai; } khác { bt.

bị vô hiệu

= false; } } } & amp; lt / script & gt; & amp; lt / html & gt;

Hãy thử

Xem Thêm  Kiểm tra địa chỉ IP của bạn - kiem tra id

Bạn có thể thêm nhiều hộp văn bản hơn vào trang web của mình và kiểm tra mã. Mỗi khi bạn thêm một số văn bản vào các trường tương ứng và chuyển tiêu điểm sang trường khác, nó sẽ nâng cao sự thay đổi sự kiện và gọi hàm quản lý. Đây là nơi nó sẽ kiểm tra xem các hộp văn bản có giá trị hay không và theo đó vô hiệu hóa hoặc bật nút gửi.

Cảm ơn bạn đã đọc. ☺

← Trước Tiếp theo →



Xem thêm những thông tin liên quan đến chủ đề cách tắt nút gửi

Dùng phím Backspace và phím Delete xóa văn bản khi nào

  • Tác giả: 26.Nguyễn Thanh Liêm
  • Ngày đăng: 2022-01-07
  • Đánh giá: 4 ⭐ ( 7947 lượt đánh giá )
  • Khớp với kết quả tìm kiếm: FANPAGE TIN TIỂU HỌC: https://business.facebook.com/NguyenThanhLiemTULC/
    Hãy bấm nút Subscribe để theo dõi nhiều video hay hơn nữa các bạn nhé!
    Code​::Blocks Codeblocks​ LaptrinhC​ C​++
    Nguyenthanhliemblog​ HDhoctinhoctieuhoc​ Tintieuhoc​ CTGDPT2018​ Taphuan2018​ CTsachmoi​ Paint​ Logo​ Scratch​ windows​ meovathay​ tinhocvanphong​ meovatmaytinh​ scratch3.0 python3.0
    Kênh Youtube: https://bit.ly/2ZL29pu​
    Website: https://laptrinhvoiscratch.blogspot.com/​
    Blogger: https://nguyenthanhliemtulc.blogspot….​
    Facebook: https://www.facebook.com/LiemNop/​
    ——————————————————————————————–

Làm cách nào để tắt tính năng tự động gửi nhận khi khởi động Outlook?

  • Tác giả: vi.extendoffice.com
  • Đánh giá: 4 ⭐ ( 4918 lượt đánh giá )
  • Khớp với kết quả tìm kiếm:

Cách thêm 2 nút nhắn tin & gọi ngay trên fanpage chi tiết

  • Tác giả: dochacmarketing.com
  • Đánh giá: 3 ⭐ ( 9193 lượt đánh giá )
  • Khớp với kết quả tìm kiếm: Cách thêm nút nhắn tin, gọi ngay, mua ngay hay nhiều nút khác vào fanpage. Các bạn cũng có thể thêm cùng lúc 2 nút trên fanpage, hay thêm nút vào bài viết
Xem Thêm  Bộ chọn màu Hex - bộ chọn màu mã hex

Cách tắt nút gửi sau khi được nhấp

  • Tác giả: chiasethongtin.com
  • Đánh giá: 3 ⭐ ( 6682 lượt đánh giá )
  • Khớp với kết quả tìm kiếm: jQuery – Cách tắt nút gửi sau khi được nhấp#Thông thường, người dùng muốn nhấn một vài lần vào nút gửi để đảm bảo nút được nhấp chắc chắn và gây ra vấn đề gửi biểu mẫu kép. Các giải pháp phổ biến là vô hiệu hóa nút gửi sau khi người dùng nhấp vào nó.

Cách thu hồi email đã gửi trong Gmail

  • Tác giả: quantrimang.com
  • Đánh giá: 5 ⭐ ( 6912 lượt đánh giá )
  • Khớp với kết quả tìm kiếm: Gmail đã tích hợp tính năng Undo Send – lấy lại thư đã gửi vô cùng hữu ích nếu bạn phát hiện nội dung email còn thiếu hay có sai sót nào đó. Tính năng thu hồi email này sẽ cứu nguy cho hàng ngàn trường hợp, đặc biệt là khi bạn có những giao dịch quan trọng với khách hàng, đối tác.

Phím tắt cho Gmail

  • Tác giả: support.google.com
  • Đánh giá: 3 ⭐ ( 4791 lượt đánh giá )
  • Khớp với kết quả tìm kiếm: Bạn có thể tiết kiệm thời gian di chuyển trong Gmail bằng cách sử dụng phím tắt.
    Lưu ý: Để tìm hiểu cách tùy chỉnh các phím tắt như trong Outlook, hãy truy c

Facebook

  • Tác giả: vi-vn.facebook.com
  • Đánh giá: 4 ⭐ ( 7121 lượt đánh giá )
  • Khớp với kết quả tìm kiếm:

Xem thêm các bài viết khác thuộc chuyên mục: Kiến thức lập trình