言語が変更されたときに、テキストエリアのカーソル位置を変更する方法は？

Question

私はtextareaを持っています。英語とアラビア語の両方が使えます。

英語は左から順に表示されます。したがって、カーソルは左から始める必要があります。

アラビア語は右から始まります。したがって、カーソルは右から始める必要があります。

ユーザーが言語を変更したときにカーソルの位置を変更するにはどうすればよいですか？彼の言語が英語の場合、カーソルは左になければならず、その逆もあります。

ユーザは、キーボードのALT + SHIFTを使用して言語を変更できます。

私はこれを試しましたが、私には何の結果も与えませんでした。

<textarea class="form-control description arabic" id="txt_desc" name="txt_desc" 
      placeholder="Description"></textarea> 

.arabic{text-align:right;} 

<script type="text/javascript"> 
    jQuery(document).ready(function($) { 
     var reverseFunc = function() { 
      $('textarea').each(function() { 
       if($(this).hasClass('arabic')) { 
        // do the invert magic... 
        var val = $(this).val(); 
        var newVal = val.charAt(val.length-1) + substr(0, val.length-1); 
        $(this).val(val); 
       } 
      }); 
     } 

     $('textarea').bind('keyup', reverseFunc); 
    }); 
</script> 

使用してshiftkey：

var x = document.getElementById("txt_desc"); 
    if (event.shiftKey) { 
     document.getElementById('txt_desc').style.direction="rtl"; 
    }else{ 
     document.getElementById('txt_desc').style.direction="ltr"; 
    } 

Answer 1

それはアラビア語はこのdirection: rtl;

var la_ar = 
["ي","و","ه","ش","س","ق","ف","غ","ع","ض","ص","ن","م","ل","ك","ظ","ط","ز","ر","ذ","د","خ","ح","ج","ث","ت","ب","ا"] 

$("input").keyup(function(){ 
 
var la_ar = 
 
["ي","و","ه","ش","س","ق","ف","غ","ع","ض","ص","ن","م","ل","ك","ظ","ط","ز","ر","ذ","د","خ","ح","ج","ث","ت","ب","ا"] 
 
    var bla = $(this).val(); 
 
    var blaـl = bla.charAt(0); 
 
    if($.inArray(blaـl, la_ar) > -1){ 
 
     //alert('in'); 
 
     $(this).css("direction","rtl"); 
 

 

 
    }else{ 
 
     //alert('out'); 
 
     $(this).css("direction","ltr"); 
 
    } 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<input type="text">

Answer 2

use the css attribute direction 

    direction: rtl; 

    In Javascript your code add this 

    var x = document.getElementById("txt_desc"); 
     if (event.shiftKey) { 
      document.getElementById('txt_desc').style.direction="rtl"; 
     }else{ 
      document.getElementById('txt_desc').style.direction="ltr"; 
     } 

Answer 3

あなたは、これが動作するHTML5のプロパティを使用する必要があります。

.arabic{ direction: rtl;} 

Answer 4

あなたはこれを試すことができます。

<textarea style="direction: rtl"></textarea>