Сегодня я увидел, что код проверки Baidu был очень интересным, поэтому я подражал этому.
Используйте JS, чтобы автоматически сравнить его после выбора 4. Затем пригласите [ответ верен! ] Или [ошибка ответа!],
В будущем я сделаю программу, и я сначала поделюсь ею с вами!
Карта эффекта выглядит следующим образом:
Исходный код заключается в следующем:
Код кода копирования следующим образом:
<!
<html xmlns = "http://www.w3.org/1999/xhtml">
<голова>
<meta http-equiv = "content-type" content = "text /html; charset = gb2312" /> />
<Title> JS Imation Baidu Post Bar Code Special Effect </title>
<style>
Div {Margin: 0;
.com {ширина: 246px;
.Clearfix: после {content: ".". ";
.j_captcha_input {border: 1px solid #ccc;}
.val_add B, .input_show Span,.
.Input_show {высота: 36px;
.Input_show Span
.val_add {Border: 1px solid #ccc;
. Val_add B {граница правая: 1px solid #dddd;
.val_add .delete {fouranght: url (http: //images/20140113213531521.png) без повторного положения 0 0 #CCC;;}
.en i {font-style: нормальный;
.val_input {ширина: 190px;
Сделано, я ,#Fff,#f5f5f5); Fafafa);
. Val_input AB {ширина: 54px;
.val_input #v_0 {background -posity: 0 -36px}
.val_input #v_1 {founal Postion: -53px -36px}/* -56px -41px;
.val_input #v_2 {founal -postion: -97px -36px}
.val_input #v_3 {background -posity: 0 -87px}
.Val_Input #V_4 {Founal Postion: -53px -87px}
.val_input #v_5 {founal -prosty: -97px -87px}
.val_input #v_6 {founale -Posity: 0 -133px}
.val_input #v_7 {founal Postion: -53px -133px}
.Val_Input #V_8 {Founal Postion: -97px -133px}
</style>
</head>
<тело>
<div>
<div id = "val_add">
<b> </b>
<b> </b>
<b> </b>
<b> </b>
<b onclick = "dele ();"> </b>
</div>
<div> <pan> </span> <a> не видно ясно?
<div> Нажмите на текст в поле, чтобы ввести рисунок на рисунке выше <i> китайских имен или пинин </i> соответствующих китайских символов </div>
<div id = "val_input">
<A href = "javascript :;"> <b id = "v_0"> </b> </a>
<A href = "javascript :;"> <b id = "v_1"> </b> </a>
<A href = "javascript :;"> <b id = "v_2"> </b> </a>
<A href = "javascript :;"> <b id = "v_3"> </b> </a>
<A href = "javascript :;"> <b id = "v_4"> </b> </a>
<A href = "javascript :;"> <b id = "v_5"> </b> </a>
<A href = "javascript :;"> <b id = "v_6"> </b> </a>
<A href = "javascript :;"> <b id = "v_7"> </b> </a>
<A href = "javascript :;"> <b id = "v_8"> </b> </a>
</div>
</div>
<Скрипт>
Функция getId (id) {
Return document.getElementbyId (id);
}
// Получить стиль атрибута
Функция getStyle (id, prop) {
var obj = getId (id);
var IE =!+"/v1";
If (prop == "founalPosition") {// IE6 ~ 8 не совместим с фоновой установкой для записи, идентифицируйте FounalPositionx/y
if (т.е.) {{
Return obj.currentStyle.backgroundpositionx +" +obj.currentStyle.backroundpositiony;
}
}
if (obj.currentStyle) {
Вернуть obj.currenstyle [prop];
}
else if (window.getComputedStyle) {
propropprop = prop.replace (/([[az])/g, "-$ 1");
proppropprop = prop.tolowercase ();
Return document.defaultview.getComputedStyle (obj, null) [prop];
}
}
var anslist = ["," "," "," "]; // контейнер для хранения
varcing = "-56px -92px, -100px -138px, -100px -92px, -3px -138px";
Var flag = 0; // от 0 -го до 3 -го до 3 -го, автоматического сравнения ответов
var adbs = getId ("val_add").
Функция addans (va) {
для (var i = 0; i <anslist.length; i ++)
{{
if (anslist [i] == "")
{{
Anslist [i] = va;
adbs [i] .style.cstext = "founal Position:"+anslist [i];
Flag = i;
Перерыв;
}
}
if (flag == 3)
{{
if (anslist == crent)
{{
оповещение («Ответ правильный!»);
}
еще
{{
Alert («Ошибка ответа!»);
dele ().
}
}
}
// очистить исходное значение
Функция dele () {
Flag = 0;
для (var i = 0; i <adbs.length; i ++)
adbs [i] .style.cstext = "";
anslist = ["," "," "," "];
}
// нажимает код проверки решетки Jiugong
Функция addEvt (tab, ct, type) {{{
var ctab = getId (tab) .getElementsbytagname ("b");
// var cdiv = getId (ct) .getElementsbytagname (type);
для (var i = 0; i <ctab.length; i ++)
{{
ctab [i] .onclight = function std () {
// alert_alet (this.id);
var st = getStyle (this.id, "founalPosition");
Var ststd = st.split ("" ");
var ST1, st2 = "";
/* -53px -36px, -56px -41px;
ST1 = parseint (std [0] .replace ("px") -3;
ST2 = parseint (std [1] .replace ("px") -5;
addans (ST1+"px"+st2+"px");
}
}
}
addEvt ("value_input");
</script>
</body>
</html>
Источник: http://www.86y.org/art_detail.aspx?