JQuery/HTML5 Input Fokus dan kedudukan kursor

$('#username').setCursorPosition(1);

jQuery pilih julat teks

Fungsi jQuery ini secara automatik memilih pelbagai teks tertentu (beberapa aksara) dalam medan input:

// Select text range
$.fn.selectRange = function(start, end) {
    return this.each(function() {
        if (this.setSelectionRange) {
            this.focus();
            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();
        }
    });
};

$('#username').selectRange(0, 5);

Soalan Lazim (Soalan Lazim)

Bahagian ini menangani soalan umum mengenai fokus input jQuery/HTML5 dan kedudukan kursor. Jawapan memberikan contoh kod ringkas untuk kejelasan. (Nota: Seksyen FAQ asal mempunyai beberapa ketidakkonsistenan pemformatan dan blok kod yang tidak diformat dengan betul sebagai kod. Versi ini membetulkan isu -isu tersebut.)

Q: Bagaimana saya boleh menetapkan kedudukan kursor pada akhir medan input menggunakan jQuery?

var input = $('#inputField');
var len = input.val().length;
input.focus();
input[0].setSelectionRange(len, len);

$('#linkID').click(function() {
  $('#inputField').focus();
});

dalam jQuery? focus focusin dicetuskan apabila elemen menerima fokus dan tidak gelembung.

focus focusin Q: Bagaimana saya boleh mencetuskan peristiwa fokus secara manual dalam jQuery?

$('#inputField').focus(); // or $('#inputField').trigger('focus');

// Set focus on input
$('input[name=firstName]').focus();

Q: Bagaimana saya boleh mencegah medan input daripada kehilangan fokus dalam jQuery?

menggunakan preventDefault dalam pengendali focusout biasanya tidak disyorkan kerana ia boleh membawa kepada tingkah laku yang tidak dijangka. Pertimbangkan pendekatan alternatif untuk mencapai hasil yang anda inginkan.

Q: Bagaimana saya boleh menetapkan fokus pada medan input seterusnya apabila kekunci Enter ditekan dalam jQuery?

<input type="text" autofocus>

Q: Bagaimana saya boleh menetapkan kedudukan kursor pada indeks tertentu dalam medan input menggunakan jQuery?

// Set cursor position
$.fn.setCursorPosition = function(pos) {
  this.each(function(index, elem) {
    if (elem.setSelectionRange) {
      elem.setSelectionRange(pos, pos);
    } else if (elem.createTextRange) {
      var range = elem.createTextRange();
      range.collapse(true);
      range.moveEnd('character', pos);
      range.moveStart('character', pos);
      range.select();
    }
  });
  return this;
};

Q: Bagaimana saya boleh mendapatkan kedudukan kursor semasa dalam medan input menggunakan jQuery?

$('#username').setCursorPosition(1);

Q: Bagaimana saya boleh memindahkan kursor ke permulaan medan input menggunakan jQuery?

// Select text range
$.fn.selectRange = function(start, end) {
    return this.each(function() {
        if (this.setSelectionRange) {
            this.focus();
            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();
        }
    });
};

Atas ialah kandungan terperinci JQuery/HTML5 Input Fokus dan kedudukan kursor. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!