Rumah >hujung hadapan web >tutorial js >Bagaimanakah Saya Boleh Menetapkan Kedudukan Kursor dalam Kawasan Teks jQuery?

Bagaimanakah Saya Boleh Menetapkan Kedudukan Kursor dalam Kawasan Teks jQuery?

DDD
DDDasal
2024-12-28 05:55:13144semak imbas

How Can I Set the Cursor Position in a jQuery Text Area?

JQuery Tetapkan Kedudukan Kursor dalam Kawasan Teks

Cabaran:

Memerlukan kaedah untuk menetapkan kedudukan kursor dalam teks kawasan menggunakan jQuery. Tingkah laku yang diingini ialah meletakkan kursor pada offset tertentu apabila medan difokuskan.

Penyelesaian jQuery:

$.fn.setCursorPosition = function(pos) {
  if (this.setSelectionRange) {
    this.setSelectionRange(pos, pos);
  } else if (this.createTextRange) {
    var range = this.createTextRange();
    range.collapse(true);
    if (pos < 0) {
      pos = $(this).val().length + pos;
    }
    range.moveEnd("character", pos);
    range.moveStart("character", pos);
    range.select();
  }
};

Penggunaan:

$('#input').focus(function() {
  $(this).setCursorPosition(4);
});

Ini akan meletakkan kursor selepas aksara keempat dalam teks medan.

Penyelesaian Alternatif:

$.fn.selectRange = function(start, end) {
  if (end === undefined) {
    end = start;
  }
  return this.each(function() {
    if ("selectionStart" in this) {
      this.selectionStart = start;
      this.selectionEnd = end;
    } else if (this.setSelectionRange) {
      this.setSelectionRange(start, end);
    } else if (this.createTextRange) {
      var range = this.createTextRange();
      range.collapse(true);
      range.moveEnd("character", end);
      range.moveStart("character", start);
      range.select();
    }
  });
};

Ini membolehkan pemilihan teks yang lebih versatil, termasuk memilih julat aksara:

$('#elem').selectRange(3, 5); // select a range of text
$('#elem').selectRange(3); // set cursor position

Atas ialah kandungan terperinci Bagaimanakah Saya Boleh Menetapkan Kedudukan Kursor dalam Kawasan Teks 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