我有一个用于更新记录的表单,底部有一个提交按钮。我希望它显示一条消息,上面写着"更新记录:"和一个"是"answers"否"框。
我找到的每一种方式都只是为了确认弹出窗口,但我不想要弹出窗口,我希望它是按钮。所以目前我有下面的给我一个确认弹出
<form class='"searchForm'" action='"cd_update.php'" method='"post'" onsubmit='"return confirm('Are you sure you want to submit?');'">
<button type="submit" id="editButton">Update</button>
这样做可能吗?我需要它在"是"上的cd_update.php,并停留在"否"的页面上
感谢
我相信这段代码就是您想要的。如果愿意,请删除onsubmit处理程序,并将no按钮上的onClick事件换成其他操作。这将允许这些按钮在没有确认弹出窗口的情况下处理您的表单。
<form class="searchForm" method="post" onsubmit="alert('Record Updated');">
Update?
<button type="submit" id="yesButton">Yes</button>
<button id="noButton" onClick="alert('Not Updated')">No</button>
</form>
您必须使用模态来自定义它。这可以简单到自己做(见下文)或使用jQuery模态(这也很简单,但可能会有些过头
http://jsfiddle.net/m7w0fcmf/1/
样式
#confirm {
display:none;
}
HTML
<form id="form" class="searchForm" action="cd_update.php" method="post">
<div id="confirm">
Update Record:
<button id="yes">Yes</button>
<button id="no">No</button>
</div>
<button type="submit" id="editButton">Update</button>
</form>
JavaScript
document.getElementById('editButton').addEventListener('click', showConfirm);
document.getElementById('no').addEventListener('click', clickNo);
function showConfirm(e) {
e.preventDefault();
document.getElementById('confirm').style.display = 'block';
}
function clickNo(e) {
e.preventDefault();
document.getElementById('confirm').style.display = 'none';
}
工作小提琴。
您可以为确认消息创建新的div
,该消息将包含您想要的两个按钮是和否,然后添加js
代码,该代码将在用户单击Update
按钮后显示此确认div
。
HTML:
<form class="searchForm" action="cd_update.php" method="post">
<div id="confirmation-msg" style="display:none">
Update Record?
<button type="submit" id="yesButton">Yes</button>
<button type="button" onClick="$('#confirmation-msg').hide()">No</button>
</div>
<button type="button" id="editButton">Update</button>
</form>
JS:
$('#editButton').click(function(){
$('#confirmation-msg').show();
});
希望这能有所帮助。