Rumah  >  Artikel  >  hujung hadapan web  >  Bagaimana untuk Melumpuhkan dan Mendayakan Butang Hantar Berdasarkan Input Medan Teks dalam jQuery?

Bagaimana untuk Melumpuhkan dan Mendayakan Butang Hantar Berdasarkan Input Medan Teks dalam jQuery?

Patricia Arquette
Patricia Arquetteasal
2024-11-10 15:04:031000semak imbas

How to Disable and Enable a Submit Button Based on Text Field Input in jQuery?

Melumpuhkan dan Mendayakan Butang Hantar dalam jQuery Berdasarkan Input Medan Teks

Memahami Isu:

Anda mahu mengawal keadaan didayakan/dilumpuhkan butang hantar berdasarkan kandungan medan teks. Cabaran timbul apabila medan teks menjadi kosong semula, memerlukan butang serah dilumpuhkan semula.

Penyelesaian:

Pada mulanya, tetapkan atribut yang dilumpuhkan bagi butang hantar:

$(document).ready(function() {
  $(':input[type="submit"]').prop('disabled', true);
});

Seterusnya, kendalikan acara keyup medan teks untuk memantau kandungannya:

$('input[type="text"]').keyup(function() {
  var text = $(this).val();

  // If the text field is not empty, enable the submit button.
  if (text != '') {
    $(':input[type="submit"]').prop('disabled', false);
  }

  // If the text field becomes empty, disable the submit button.
  else {
    $(':input[type="submit"]').prop('disabled', true);
  }
});

Dengan pendekatan ini, anda boleh melumpuhkan dan mendayakan butang serah secara dinamik mengenai kehadiran input dalam medan teks.

Atas ialah kandungan terperinci Bagaimana untuk Melumpuhkan dan Mendayakan Butang Hantar Berdasarkan Input Medan Teks dalam jQuery?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan:
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn