Search code examples
javascriptunicodetextbox

JavaScript Unicode Input Text Box

I'm trying to use JavaScript to set the value of an Input Text Box to this Emoji >> 🤔
But it didn't work as I expect it to.
I've tried several different format to express the Unicode but none of it works.
I've included the snippet that I've tried. 

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
  </head>
  <body>

    <script>
      var myTextBox = document.createElement("input");
      document.body.appendChild( myTextBox );
      myTextBox.value = "&#129300";

      //	None of below will work:
      //	\u1F914
      //	\xF0\x9F\xA4\x94
      //	&#129300;
    </script>

    <p> &#129300; </p>

  </body>
</html>

Any idea on how to do this properly?

Solution

  • You need to convert it into a surrogate pair: "\uD83E\uDD14"

    <!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
  </head>
  <body>

    <script>
      var myTextBox = document.createElement("input");
      document.body.appendChild( myTextBox );
      myTextBox.value = "\uD83E\uDD14";
    </script>

    <p> &#129300; </p>

  </body>
</html>