Javascript 提交按钮显示是或否

我有一个用于更新记录的表单，在底部有一个提交按钮。我希望它显示一条消息，上面写着“更新记录：”和一个“是”和“否”框

我找到的每一种方法都只是为了确认弹出窗口，但我不想要弹出窗口，我希望它是按钮。因此，目前我有下面给我一个确认弹出窗口

<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上显示“是”，并在页面上显示“否”

谢谢

您可以为确认消息创建新的

div

，该消息将包含您想要的两个按钮Yes和No，然后添加

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>

$('#editButton').click(function(){
    $('#confirmation-msg').show();
});

---

希望这能有所帮助。

我相信这段代码正是您需要的。如果愿意，请删除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模式（这也很简单，但可能有些过分）

风格

HTML

---

提出问题的用户正在寻找一种方法，让两个按钮进行确认，而不是使用确认弹出窗口。有一千种方法可以做到这一点。因此，是的，这是可能的。

#confirm {
    display:none;
}

<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>

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';
}