How to detect the language and change HTML input text direction automatically with CSS and jQuery

1 Answer

<!DOCTYPE html>
<html>
    <head>
        <script type="text/javascript" src="js/jquery-2.2.2.min.js"></script>  
    </head>

    <body>

        <form name="yourForm" method="get">
            <input type="text" >
            <input type="submit" value="search" name="search" />
        </form>

        <script type="text/JavaScript">
            $('input').keyup(function(){
                $this = $(this);
                if($this.val().length == 1)
                {
                    var ch =  new RegExp("[\x00-\x80]+"); // ascii characters

                    var isAscii = ch.test($this.val());

                    if(isAscii)
                    {
                        $this.css("direction", "ltr");
                    }
                    else
                    {
                        $this.css("direction", "rtl");
                    }
                }

            });
        </script>

    </body>
</html>

/* css file */

input
{
    direction:ltr;
}

70+ SQL courses for beginners and professionals

answered Apr 4, 2016 by avibootz
edited Feb 13, 2019 by avibootz

Most popular tags

How to detect the language and change HTML input text direction automatically with CSS and jQuery

1 Answer

Related questions