獲取表單網址而不提交

Question

當談到JQuery或Javascript時，我是新手 - 如果這是一個簡單的問題，那么道歉......

基本上，我有一個GET表單 - 我需要攔截 - 這意味着我需要調用javascript而不是實際提交表單，當按下提交按鈕時。 我想將完整的URL作為輸出......類似於......

http://server/cgi-bin/status.py?val=1223&val2=434334&val3=4343 

表格 -

基本上，我需要表單來處理URL，就好像它會提交，但不提交。 主要要求是將此鏈接小瓶郵件發送給客戶，以便他們可以使用此鏈接跟蹤作業進度

謝謝王子

Answer 1

如果您需要使用javascript處理表單並阻止提交，則需要在用戶按下提交按鈕時在表單上發生的submit事件中添加一個監聽器。 只需在表單元素中添加一個id屬性：

<form method="get" id="myForm">
...
</form>

然后添加監聽器：

<script>
$(function(){
    $("#myForm').on('submit', function(event) {
        event.preventDefault(); // This line prevents the normal behaviour of the submit button

        var queryString = $(this).serialize(); // This will generate a query string like so : "val=1223&val2=434334&val3=4343"

        var url = "http://server/cgi-bin/status.py?" + queryString; // Now you have the full URL

        // Then you can send an AJAX request to a server-side script that will send the mail
        $.ajax({
            url: 'http://server/cgi-bin/email.py', // Your e-mailing script
            method: 'POST', // or GET whatever
            data: {
                url: url,
                email: 'recipient@domain.com'
            },
            ...
        })

    })
})


</script>

Answer 2

這可以通過這樣的方式完成

 $('form').on('submit', function(event) {
    var url = '<insert-path-to-desired-script>?' + $(this).serialize();

    event.preventDefault();
});

event.preventDefault()確保表單實際上不提交。

然后， url包含一個包含所有表單屬性的完整URL。