Я делаю сайт, на котором, когда пользователь добавляет ответ в текстовое поле и нажимает кнопку отправки, тогда, если это правильный ответ, он будет казаться зеленым, иначе красный и изображение действительного и недействительного будут отображаться в текстовом поле уважительно... Пожалуйста помогите мне.. у меня есть следующие строки кода..
Код HLML:
<body>
<div id="content">babababababababababa.
<input type="text" id="ans1" />y
<input type="text" id="ans2" />asasasasasa
<br />
<br />
<input type="text" id="ans3" />rtrtrtr
<input type="text" id="ans4" />sddddddd
<input type="text" id="ans5" />iuyerr
<input type="text" id="ans6" />a la
<br />
<br />situación actual y
<input type="text" id="ans7" />cccccc
<input type="text" id="ans8" />skdodksodsdkss
<br />
<br />
<br />
<div align="center">
<input type="submit" onClick="check()" />
</div>
</div>
</body>
Код CSS:
#ans1 ,#ans6 {
background:#FFFFFF url(xx.png) 4px 4px ;
background-position: right top;
background-repeat: no-repeat;
padding:4px 4px 4px 22px;
height:22px;
}
input[type="text"],input[type="submit"]
{
border:none;
border:1px solid black;
border-radius:5px;
width:143px;
height:23px;
background:red;
background:#EEEEEE;
font-weight:bold;
}
body
{
background:#BBBBBB;
margin:auto;
padding:100px;
}
#content
{
border:2px solid #AAAAAA;
border-radius:15px 15px;
padding:20px;
}
Код Javascript:
function check() {
var ans1 = document.getElementById("ans1").value;
var a1ns1 = document.getElementById("ans1");
if (ans1 == "Crear") {
a1ns1.style.color = "green";
} else {
a1ns1.style.color = "red";
}
}
Если вы хотите изменить изображение текстового поля с помощью jQuery, вы можете сделать что-то вроде этого:
$('#ans1').css('background-image', 'url("url-to-your-image")');
Вы можете добавить изображение в текстовое поле с помощью css background-image.
input{
background-image: url(your-image-url);
}