我有一个分类广告网站，在显示广告的页面上，我正在创建“向朋友发送提示”表单...
因此，任何想要的人都可以将广告提示发送给某些朋友的电子邮件地址。
我猜表格必须提交到php页面，对吗？
<form name='tip' method='post' action='tip.php'>
Tip somebody: <input name="tip_email" type="text" size="30" onfocus="tip_div(1);" onblur="tip_div(2);"/>
<input type="submit" value="Skicka Tips"/>
<input type="hidden" name="ad_id" />
</form>提交表单时，页面被重新加载...我不想要...
有什么办法可以使其不重新加载并仍然发送邮件？最好没有ajax或jquery ...
谢谢
<iframe>该target属性即可完成。
Answers:
您需要提交ajax请求来发送电子邮件，而无需重新加载页面。看看http://api.jquery.com/jQuery.ajax/
您的代码应类似于以下内容：
$('#submit').click(function() {
$.ajax({
url: 'send_email.php',
type: 'POST',
data: {
email: 'email@example.com',
message: 'hello world!'
},
success: function(msg) {
alert('Email Sent');
}
});
});该表格将在后台提交到该send_email.php页面，该页面将需要处理请求并发送电子邮件。
return false;在最后一个方括号之前添加
我发现我认为是更简单的方法。如果您在页面中放置了iframe，则可以在其中重定向操作的退出并使其显示。当然，你什么也做不了。在这种情况下，您可以将iframe显示设置为无。
<iframe name="votar" style="display:none;"></iframe>
<form action="tip.php" method="post" target="votar">
<input type="submit" value="Skicka Tips">
<input type="hidden" name="ad_id" value="2">
</form>action="about:blank"
$_POST["ad_id"]
您可以使用AJAX或
<form id="myGiswebForm" method="post" action="https://******/saveForm.asp" target="myiframe">和<iframe style="display:none;" src="" name="myiframe"></iframe>
最快，最简单的方法是使用iframe。在页面底部放置一个框架。
<iframe name="frame"></iframe>
并以您的形式执行此操作。
<form target="frame">
</form>并使该框架在您的CSS中不可见。
iframe{
display: none;
}display:none;和不应该border:0px。尝试过编辑，但我的编辑遭到审稿人的拒绝，这些审稿人似乎并不在乎编辑评论。请修改您的答案以修正代码。
这是我在互联网上找到的一些可解决此问题的代码：
提交表单后，该操作将被执行，并以指定的iframe重新加载为目标。
<iframe name="content" style="">
</iframe>
<form action="iframe_content.php" method="post" target="content">
<input type="text" name="Name" value="">
<input type="submit" name="Submit" value="Submit">
</form><?php
if (isset($_POST['Submit'])){
$Name = $_POST['Name'];
echo $Name;
}
?> <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/core.js">
</script>
<script type="text/javascript">
function clickButton(){
var name=document.getElementById('name').value;
var descr=document.getElementById('descr').value;
$.ajax({
type:"post",
url:"server_action.php",
data:
{
'name' :name,
'descr' :descr
},
cache:false,
success: function (html)
{
alert('Data Send');
$('#msg').html(html);
}
});
return false;
}
</script>
<form >
<input type="" name="name" id="name">
<input type="" name="descr" id="descr">
<input type="submit" name="" value="submit" onclick="return clickButton();">
</form>
<p id="msg"></p><?php
$name = $_POST['name'];
$descr = $_POST['descr'];
echo $name;
echo $descr;
?>jquery-ajax在这种情况下，必须采取帮助。没有ajax，目前没有解决方案。
首先，在提交表单时调用JavaScript函数。刚刚设置onsubmit="func()"。即使调用了该函数，也会执行提交的默认操作。如果执行该操作，将无法阻止页面刷新或重定向。因此，下一个任务是阻止默认操作。在的开头插入以下行func()。
event.preventDefault()现在，将没有重定向或刷新。因此，您只需从发出ajax调用，func()然后在调用结束时做您想做的任何事情。
例：
形成：
<form id="form-id" onsubmit="func()">
<input id="input-id" type="text">
</form>Javascript：
function func(){
event.preventDefault();
var newValue = $('#input-field-id').val();
$.ajax({
type: 'POST',
url: '...',
data: {...},
datatype: 'JSON',
success: function(data){...},
error: function(){...},
});
}这就是不用jQuery和AJAX就可以工作的方式，并且使用简单的iFrame可以很好地工作。我喜欢它，可以在Opera10，FF3和IE6中使用。由于上面的一些海报为我指明了正确的方向，所以这是我在此处发布的唯一原因：
<select name="aAddToPage[65654]"
onchange="
if (bCanAddMore) {
addToPage(65654,this);
}
else {
alert('Could not add another, wait until previous is added.');
this.options[0].selected = true;
};
" />
<option value="">Add to page..</option>
[more options with values here]</select>
<script type="text/javascript">
function addToPage(iProduct, oSelect){
iPage = oSelect.options[oSelect.selectedIndex].value;
if (iPage != "") {
bCanAddMore = false;
window.hiddenFrame.document.formFrame.iProduct.value = iProduct;
window.hiddenFrame.document.formFrame.iAddToPage.value = iPage;
window.hiddenFrame.document.formFrame.submit();
}
}
var bCanAddMore = true;</script>
<iframe name="hiddenFrame" style="display:none;" src="frame.php?p=addProductToPage" onload="bCanAddMore = true;"></iframe>生成上面被调用页面的php代码：
if( $_GET['p'] == 'addProductToPage' ){ // hidden form processing
if(!empty($_POST['iAddToPage'])) {
//.. do something with it..
}
print('
<html>
<body>
<form name="formFrame" id="formFrameId" style="display:none;" method="POST" action="frame.php?p=addProductToPage" >
<input type="hidden" name="iProduct" value="" />
<input type="hidden" name="iAddToPage" value="" />
</form>
</body>
</html>
');
}print打印HTML代码。只需关闭php标签，?>然后添加html代码即可。并避免使用exit它是不必要的（致命错误，...）
这应该可以解决您的问题。
在此代码中，单击“提交”按钮后，我们将其称为jquery ajax，并将URL传递给发布
类型POST / GET
数据：您可以选择输入字段或任何其他数据信息。
成功：如果服务器
功能参数文本，html或json 一切正常，则进行回调，如果服务器响应
成功，则可以写写警告（如果获取的数据处于某种状态），等等。或执行您的代码下一步该做什么。
<form id='tip'>
Tip somebody: <input name="tip_email" id="tip_email" type="text" size="30" onfocus="tip_div(1);" onblur="tip_div(2);"/>
<input type="submit" id="submit" value="Skicka Tips"/>
<input type="hidden" id="ad_id" name="ad_id" />
</form>
<script>
$( "#tip" ).submit(function( e ) {
e.preventDefault();
$.ajax({
url: tip.php,
type:'POST',
data:
{
tip_email: $('#tip_email').val(),
ad_id: $('#ad_id').val()
},
success: function(msg)
{
alert('Email Sent');
}
});
});
</script>我做了类似于上面的jquery的操作，但是我需要重置表单数据和图形附件画布。所以这是我想出的：
<script>
$(document).ready(function(){
$("#text_only_radio_button_id").click(function(){
$("#single_pic_div").hide();
$("#multi_pic_div").hide();
});
$("#pic_radio_button_id").click(function(){
$("#single_pic_div").show();
$("#multi_pic_div").hide();
});
$("#gallery_radio_button_id").click(function(){
$("#single_pic_div").hide();
$("#multi_pic_div").show();
});
$("#my_Submit_button_ID").click(function() {
$("#single_pic_div").hide();
$("#multi_pic_div").hide();
var url = "script_the_form_gets_posted_to.php";
$.ajax({
type: "POST",
url: url,
data: $("#html_form_id").serialize(),
success: function(){
document.getElementById("html_form_id").reset();
var canvas=document.getElementById("canvas");
var canvasA=document.getElementById("canvasA");
var canvasB=document.getElementById("canvasB");
var canvasC=document.getElementById("canvasC");
var canvasD=document.getElementById("canvasD");
var ctx=canvas.getContext("2d");
var ctxA=canvasA.getContext("2d");
var ctxB=canvasB.getContext("2d");
var ctxC=canvasC.getContext("2d");
var ctxD=canvasD.getContext("2d");
ctx.clearRect(0, 0,480,480);
ctxA.clearRect(0, 0,480,480);
ctxB.clearRect(0, 0,480,480);
ctxC.clearRect(0, 0,480,480);
ctxD.clearRect(0, 0,480,480);
} });
return false;
}); });
</script>这对我来说很好，对于您的html表单应用程序，我们可以像下面这样简化jquery代码：
<script>
$(document).ready(function(){
$("#my_Submit_button_ID").click(function() {
var url = "script_the_form_gets_posted_to.php";
$.ajax({
type: "POST",
url: url,
data: $("#html_form_id").serialize(),
success: function(){
document.getElementById("html_form_id").reset();
} });
return false;
}); });
</script>另一种可能性是使JavaScript直接链接到您的函数：
<form action="javascript:your_function();" method="post">...
function Foo(){
event.preventDefault();
$.ajax( {
url:"<?php echo base_url();?>Controllername/ctlr_function",
type:"POST",
data:'email='+$("#email").val(),
success:function(msg) {
alert('You are subscribed');
}
} );
}我尝试了很多次以寻求一个好的解决方案，@ taufique的回答帮助我得出了这个答案。
注意：别忘 event.preventDefault(); 了在函数主体的开头。
这是一些jQuery，用于发布到php页面并获取html：
$('form').submit(function() {
$.post('tip.php', function(html) {
// do what you need in your success callback
}
return false;
});