Только начал изучать JavaScript. Задача в следующем, на странице сайта есть кнопка удаление записи из таблицы mysql. Мне нужно, при нажатии на эту кнопку, чтобы всплывало окно подтверждения удаления с двумя кнопками
Да и
Нет. Если нажимаю
ДА идет отправка на сервер и запись удаляется, если кликаю НЕТ - отправка на сервер не осуществляться и всплывающие окно исчезает.
Вот написал такой код:
function checkButton()
{
var hid = document.getElementById('hidden'); //Находим id всасывающегося окна
var yes = document.getElementById('yes'); // id кнопки ДА
var no = document.getElementById('no'); // id кнопки НЕТ
if(yes.onclick) //если была нажата кнопка ДА
{
hid.className = ''; // скрывается окно подтверждения
return true; //// отправка на сервер происходит
}
else if(no.onclick) // Если была нажата кнопка НЕТ
{
hid.className = ''; //скрывается окно подтверждения
return false; // отправка на сервер не происходит
}
else // Иначе отображается окно подтверждения.
{
hid.className = 'substrate';
return false; // отправка на сервер не происходит
}
}
window.onload = function()
{
var myf = document.getElementById('dell');
myf.onclick = checkButton; //Подписка на событие клика по кнопке УДАЛИТЬ
}
<body>
<form method="get">
<input id="dell" type="submit" name="dell" value="Delete">
</form>
<div id="hidden" class="show-none">
<div class="warn-window">
<div class="warn-title">Предупреждение</div>
<span>Вы действительно хотите удалить?</span>
<div class="warn-act">
<input id="yes" type="button" name="yes" value="Да">
<input id="no" type="button" name="no" value="Нет">
</div>
</div>
</div>
</body>
.substrate{
z-index:1;
position: absolute;
background-color: #000;
opacity: 0.8;
filter: alpha(opacity=80);
width: 100%;
height: 100%;
top: 0;
left: 0;
display: block;
}
.show-none{
position: absolute;
top: -10000px;
left: -10000px;
}
.warn-window{
z-index:2;
background: #fff;
height: 180px;
width: 300px;
border: 1px #3CCB34 solid;
border-radius:5px;
margin:150px auto;
}
.warn-window span {padding:7px 10px; display:block; width:100%; height: 77px; overflow:hidden; font-size:16px;}
.warn-title {background-color:#3CCB34; height:30px; color:#fff; padding:4px 5px 0; font:bold 17px tahoma;}
.warn-act {width:100%; text-align:center; margin-top:10px;}
.warn-act input {margin:3px; cursor: pointer; width:100px; height: 27px;}
При нажатии кнопки Delete все нормально работает - всплывает окно с кнопками да и нет. Но при нажатии на эти кнопки ничего не происходит(. Подскажите где ошибки пожалуйста.