获取表单网址而不提交

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。