发送跨域HTTP发布HTML表单 [英] Send cross domain HTTP Post with HTML forms
问题描述
我有我需要在提交前做一些处理这个HTML表单:
I have this HTML form that I need to do some processing before submitting:
<form action="http://appid.appspot.com/api/foo" id="contact-form" method="post"
name="contact-form">
<fieldset>
<label><input name="email" onblur=
"if(this.value=='') this.value='Email'" onfocus=
"if(this.value =='Email' ) this.value=''" value="Email"></label>
<label><input name="subject" onblur=
"if(this.value=='') this.value='Subject'" onfocus=
"if(this.value =='Subject' ) this.value=''" value="Subject"></label>
<textarea name="message" onblur=
"if(this.value=='') this.value='Message'" onfocus=
"if(this.value =='Message' ) this.value=''">
Message
</textarea>
<div class="buttons">
<a href="#" onclick=
"document.getElementById('contact-form').reset()">Clear</a>
<a href="#" onclick=
"document.getElementById('contact-form').submit()">Send</a>
</div>
</fieldset>
</form>
基本上,我需要做的是:
Basically, what I need to do are:
-
当点击提交按钮,则会弹出一个窗口似乎表明(通过检查服务器响应)已提交的信息,无论如何,
When the submit button is clicked, a popup window will appear to indicate that the message have been submitted (by checking the server response) anyway,
我需要复制的具体形式输入的值,即输入元素的值。然后prePEND,说,电子邮件实际的消息,这样的形式是信息将是例如电子邮件:x@dot.com消息:世界,你好
&LT; - 这将是与NAME =消息输入元素的值只是发送表单域的API之前
I need to copy the value of a specific form input, say the value of the input element. And then prepend, say, the email to the actual message, such that the form "message" will be for example "Email: x@dot.com Message: Hello world"
<-- this will be the value of the input element with name="message" just before sending the form fields to the api
更新:
我的意思在我的问题是,我想这个基本的HTML表单的后期迁移到一个Ajax调用,如果这样做会更好,这样我就可以轻松实现上面我所提出的目标。
What I mean in my question is that I want to migrate this basic HTML form based POST into an Ajax call if that would be better, so I can easily achieve the goals I have outlined above.
推荐答案
您要使用的表单的的onsubmit
。
我改变了你的HTML(特别是内联JavaScript)位(为清楚起见):
I changed your html (and especially inline javascript) a bit (for clarity):
<form action="http://appid.appspot.com/api/foo" id="contact-form" method="post"
name="contact-form" onsubmit="return doStuff() ? true:false;">
<fieldset>
<input name="email" value="Email"
onblur="if(this.value===''){this.value=this.defaultValue}"
onfocus="if(this.value===this.defaultValue){this.value=''}" > <br>
<input name="subject" value="Subject"
onblur="if(this.value===''){this.value=this.defaultValue}"
onfocus="if(this.value===this.defaultValue){this.value=''}" > <br>
<textarea name="message"
onblur="if(this.value===''){this.value=this.defaultValue}"
onfocus="if(this.value===this.defaultValue){this.value=''}"
>Message</textarea>
<div class="buttons">
<a href="#" onclick=
"document.getElementById('contact-form').reset()">Clear</a>
<a href="#" onclick=
"if(doStuff()){document.getElementById('contact-form').submit();}">Send</a>
</div>
</fieldset>
</form>
正如你可以看到输入元素的自动填充/自动清除样的,现在重复,所以你可以因子它在一个单独的通用功能。
As you can see the autofill/autoclear on the input-elements now kind of repeats, so you could factor it out in a separate universal function.
下面是运行前的实际形式提交的JavaScript函数:
Here is the javascript function that runs before the form actually submits:
function doStuff(){
var eml=document.getElementsByName('email')[0].value;
msg=document.getElementsByName('message')[0];
msg.value = 'Email: ' + eml + ' Message: ' + msg.value;
alert ('message has been submitted');
return true;
}
这样做跨域可能变得棘手,如果其他域使用会话cookie和/或检查文件引用。
Doing this cross-domain might get tricky if the other domain uses session-cookies and/or checks document referrer.
更新:我看到你更新你的问题,现在要检查并显示服务器响应你的消息
Update: I see you updated your question and now want to check and display the server-response in your message to?
这篇关于发送跨域HTTP发布HTML表单的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!