Как добавить звездочку в плейсхолдер внутри инпута?

Question

[Fredd Monty]

Всем привет!
Как вставить звездочку?

Я нашел один способ, но он немного не доработан.
При клике пропадает, но если оставить пустым, не появляется.

<div class="container">
	<div class="col-md-4">
		<form>
			<div class="form-group">
				<input type="email" type="email" class="form-control" id="exampleInputEmail1" onclick="hideIcon()" placeholder="Email Address">
			</div>
		</form>
	</div>
</div>

.form-group {
	padding: 50px 0;
	background-image: url("../img/star.png");
	background-repeat: no-repeat;	
}

function hideIcon() {
  document.getElementById('exampleInputEmail1').style.backgroundImage = 'none';
}

Кто как делает?
Всем спасибо!

Answer 1

[Алекс Глебов]

Я бы сказал, что это ошибка дизайнера, и оставил звездочку серой.
Если не прокатит, можно вот так https://jsfiddle.net/Lo33tnbp/

Comments

[Sergei Nazarenko]

не такая звезда https://jsfiddle.net/Lo33tnbp/1/

Answer 2

[Максим]

Мне кажется или input ваш грешит отсутствием name при избыточности type ?
Можно использовать js
$('input[name=email]').val('e-mail*');

Answer 3

[gwenn]

.placeholder:after {
  position: absolute;
  top: 0;
  right: 0;
  color: red;
  content: '*';
}