Rumah  >  Artikel  >  hujung hadapan web  >  Javascript melaksanakan kaedah pemprosesan lekukan kunci tab dalam kemahiran textarea_javascript

Javascript melaksanakan kaedah pemprosesan lekukan kunci tab dalam kemahiran textarea_javascript

WBOY
WBOYasal
2016-05-16 15:52:261499semak imbas

Contoh dalam artikel ini menerangkan cara melaksanakan pemprosesan lekukan kekunci tab dalam textarea menggunakan JavaScript. Kongsikan dengan semua orang untuk rujukan anda. Butirannya adalah seperti berikut:

Saya mencari di Internet untuk penyelesaian berkaitan yang lain menggunakan dua atau tiga baris javascript untuk menyelesaikan masalah, tetapi mereka semua mempunyai masalah kecil. Terdapat juga satu yang menggunakan JQuery, yang juga sangat mudah.

Kod javascript dalam artikel ini melaksanakan fungsi memasukkan kunci TAB dalam TEXTAREA dan mengindennya secara automatik. Walau bagaimanapun, kod ini tidak boleh dilaksanakan seperti biasa dalam Google Chrome Dalam

Salin kod Kod adalah seperti berikut:
sel =event.srcElement.document.selection.createRange()

Ralat akan berlaku dalam ayat ini:
ncaught exception TypeError: Tidak dapat membaca 'pemilihan' sifat undefined

Kod dijalankan seperti biasa dalam IE, seperti berikut:

<mce:script type="text/javascript">
<!-- 
function editTab() 
{ 
  var code, sel, tmp, r 
  var tabs="" 
  event.returnValue = false 
  sel =event.srcElement.document.selection.createRange() 
  r = event.srcElement.createTextRange() 
  switch (event.keyCode) 
  { 
    case (8)  : 
      if (!(sel.getClientRects().length > 1)) 
      { 
        event.returnValue = true 
        return 
      } 
      code = sel.text 
      tmp = sel.duplicate() 
      tmp.moveToPoint(r.getBoundingClientRect().left, sel.getClientRects()[0].top) 
      sel.setEndPoint("startToStart", tmp) 
      sel.text = sel.text.replace(/^/t/gm, "") 
      code = code.replace(/^/t/gm, "").replace(//r/n/g, "/r") 
      r.findText(code) 
      r.select() 
      break 
    case (9)  : 
      if (sel.getClientRects().length > 1) 
      { 
        code = sel.text 
        tmp = sel.duplicate() 
        tmp.moveToPoint(r.getBoundingClientRect().left, sel.getClientRects()[0].top) 
        sel.setEndPoint("startToStart", tmp) 
        sel.text = "/t"+sel.text.replace(//r/n/g, "/r/t") 
        code = code.replace(//r/n/g, "/r/t") 
        r.findText(code) 
        r.select() 
      } 
      else 
      { 
        sel.text = "/t" 
        sel.select() 
      } 
      break 
    case (13)  : 
      tmp = sel.duplicate() 
      tmp.moveToPoint(r.getBoundingClientRect().left, sel.getClientRects()[0].top) 
      tmp.setEndPoint("endToEnd", sel) 
      for (var i=0; tmp.text.match(/^[/t]+/g) && i<tmp.text.match(/^[/t]+/g)[0].length; i++)  tabs += "/t" 
      sel.text = "/r/n"+tabs 
      sel.select() 
      break 
    default   : 
      event.returnValue = true 
      break 
  } 
} 
// -->
</mce:script>

Apabila menggunakan:

Salin kod Kod adalah seperti berikut:
e09aa8e5124754249366fd99a2b759f040587128eee8df8f03d0b607fe983014

Saya harap artikel ini akan membantu reka bentuk pengaturcaraan JavaScript semua orang.

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