获取表单URL而不提交

Question

我是 jQuery 或 JavaScript 方面的新手，如果这很简单，我很抱歉。

基本上，我有一个需要拦截的

GET

表单，这意味着当按下

submit

按钮时，我需要调用 JavaScript 而不是实际提交表单。我想要完整的 URL 作为输出，如下所示：

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

表格

<form class="form-wrapper_2"
      name="myForm"
      onsubmit="return confirm('Are you sure?')" 
      action="http://server/cgi-bin/status.py"
      method="get">
    <input>
</form>

基本上，我需要

form

来处理 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: '[email protected]'
            },
            ...
        })

    })
})


</script>

Answer 2

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

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

    event.preventDefault();
});

event.preventDefault()

确保表单实际上并未提交。

url

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