Bagaimanakah Saya Boleh Menentukan Offset Aksara Mula dan Tamat Pilihan Pengguna dalam Elemen HTML Induknya?

Menentukan Offset Mula dan Tamat Julat Dalam Bekas Induknya

Masalah

Memandangkan elemen HTML, bagaimana seseorang boleh menentukan offset aksara dalam bekas induk di mana julat (pemilihan pengguna) bermula dan berakhir, walaupun semasa pemilihan merangkumi HTML tag?

Penyelesaian

Respons Dikemas Kini:

Untuk mendapatkan kedua-dua offset permulaan dan akhir:

function getSelectionCharacterOffsetWithin(element) {
  // Determine start and end offsets
  var start = 0;
  var end = 0;
  // Create ranges
  var range = getRangeAt(0);
  var preCaretRange = range.cloneRange();

  // Set start offset
  preCaretRange.selectNodeContents(element);
  preCaretRange.setEnd(range.startContainer, range.startOffset);
  start = preCaretRange.toString().length;

  // Set end offset
  preCaretRange.setEnd(range.endContainer, range.endOffset);
  end = preCaretRange.toString().length;

  // Return the object
  return { start: start, end: end };
}

Respons Asal:

Kod yang disediakan menggunakan getSelection() dan getRangeAt(0) untuk mendapatkan semula pemilihan. Ia kemudian mengira offset kedudukan karet dalam elemen menggunakan kaedah toString() pada julat. Pendekatan ini hanya menyediakan kedudukan offset atau karet hujung.

Contoh:

function getRangeCharacterOffsetWithin(element) {
  var range, sel;
  if ((sel = window.getSelection())) {
    range = sel.getRangeAt(0);
    range.collapse(false);
    prevRange = range.cloneRange();
    prevRange.selectNodeContents(element);
    prevRange.setEnd(range.endContainer, range.endOffset);
    return prevRange.toString().length;
  }
  return 0;
}

Atas ialah kandungan terperinci Bagaimanakah Saya Boleh Menentukan Offset Aksara Mula dan Tamat Pilihan Pengguna dalam Elemen HTML Induknya?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!