雙重提交，防止默認不工作

我在我的頁面上有兩個按鈕。「保存」和「發佈」。這是HTML：

<button type="submit" class="button">Save</button> 
<button type="button" class="button" name="publish" value="true" onclick="publishAlbum({{ album.id }}, '{{ album.title }}')">Publish</button>

第一個保存相冊，第二個發送電子郵件給業主。第二個（「發佈」）需要先觸發確認（「你確定嗎？」）。當你點擊「確定」時，表單應該提交，但是如果你點擊「取消」（在確認框中），它應該什麼也不做。

這裏是我的JS：

function publishAlbum(album_id, album_title) 
    { 
     var result = confirm('Are you sure you want to publish this album?'); 

     if(!result) 
     { 
      return; 
     } 

    }

我想所有的一切（防止默認情況下，返回等），但每次我點擊「取消」，形式仍然提交和電子郵件發送。

有人可以幫助我嗎？

來源

2017-08-29 R-b-n

「取消」按鈕不是默認的窗體控件。您必須取消提交處理程序中的默認操作，而不是任意點擊處理程序。「 – Teemu

」我嘗試了字面上的一切（防止默認「你甚至不傳遞事件對象到你的點擊處理程序你怎麼試圖防止默認動作呢？ –

顯示你的代碼或它沒有發生;） – sandrooco

發佈

$('.publish-button').on('click',function(e){ 
    e.preventDefault(); 
    let albumId = $('#selectYourAlbumId'); 
    let albumTitle = $('#selectYourAlbumTitle'); 
    var result = confirm('Are you sure you want to publish this album?'); 
    if(!result) 
    { 
     return; 
    } 
    // POST your form through an AJAX call 

})

來源

2017-08-29 08:16:02

你需要得到事件對象以某種方式（例如，通過添加事件監聽器按鈕）。然後，您可以防止表單提交，就像這樣：

const album = { 
 
    id: 1, 
 
    title: 'Test', 
 
}; 
 

 
document.querySelector('[name=publish]').addEventListener('click', function(e) { 
 
    if (!publishAlbum(album.id, album.title)) { 
 
    e.preventDefault(); 
 
    } 
 
}); 
 

 
function publishAlbum(album_id, album_title) { 
 
    var result = confirm('Are you sure you want to publish this album?'); 
 

 
    if (!result) { 
 
    return false; 
 
    } 
 

 
    // do your stuff 
 
    return true; 
 
}

<form action="https://example.org" method="POST"> 
 
    <button type="submit" class="button">Save</button> 
 
    <input type="submit" class="button" name="publish" value="Publish" /> 
 
</form>

來源

2017-08-29 08:16:37 lumio

假設你有一個表單標籤內的這些按鈕，你可以試試這個：

<html> 
<body> 

<h2>JavaScript Confirm Box</h2> 


<button type="submit" class="button">Save</button> 
<button type="button" class="button" name="publish" value="true" onclick="publishAlbum()" id="myButton">Publish</button> 

<script> 
function publishAlbum() { 
    var txt; 
    if (confirm("Press a button!") == true) { 
     $("#myButton").trigger('submit'); 
    } else { 
     txt = "You pressed Cancel!"; 
     alert(txt) 
    } 
} 
</script> 

</body> 
</html>

來源

2017-08-29 08:21:40 SilverSurfer

我用這個：

$(document).ready(function() { 
    $('#form-publish .button-publish').on("click", function(e) { 
     var c = confirm("Are you sure?"); 
     if (c) { 
      return; 
     } else { 
      e.preventDefault(); 
     } 
    }); 
});

來源

2017-08-29 10:37:10

雙重提交，防止默認不工作

回答

相關問題