获取表单网址而不提交

时间:2016-11-11 12:53:39

标签: javascript jquery html ajax forms

当谈到JQuery或Javascript时,我是新手 - 如果这很容易就道歉......

基本上,我有一个GET表单 - 我需要拦截 - 这意味着我需要调用javascript而不是实际提交表单,当按下提交按钮时。我希望将完整的URL作为输出......类似于......

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

表格 -

基本上,我需要表单来处理URL,就好像它会提交,但不提交。主要要求是将此链接小瓶邮件发送给客户,以便他们可以使用此链接跟踪作业进度

谢谢, 王子

2 个答案:

答案 0 :(得分:2)

如果您需要使用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>

答案 1 :(得分:1)

这可以用这样的东西来完成

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

    event.preventDefault();
});

event.preventDefault()确保表单实际上没有提交。

url然后包含一个包含所有表单属性的完整URL。