Динамически использовать значок веб-шрифта в качестве заполнителя в поле ввода

Question

Я пытаюсь динамически установить заполнитель поля ввода, используя шрифт MaterialDesignIcons в качестве шрифта заполнителя.

При использовании в качестве статического заполнителя он работает как положено, и значок отображается, когда текстовое поле пусто.

<input type="text" id="sampleInput" placeholder="&#xF6E3;" />

input#sampleInput::-webkit-input-placeholder {
    font-family: "Material Design Icons";
}

Использование динамического метода jquery вызывает у меня некоторые проблемы. Кажется, что код символа не экранирован правильно в html.

$('#sampleInput').prop('placeholder',"");

Answer 1

Вы можете попробовать это:

$('#sampleInput').prop('placeholder',"\uxF6E3");

Вы можете проверить это jsfiddle Пример: http://jsfiddle.net/anaselalami/pty6ao7m/1/