使用AJAX将变量发送到PHP(Sending variable to PHP with AJAX)

我试图将存储在变量中的元素的ID发送到我的PHP文件，但它不发送它。我的JS文件中的警报消失了，所以问题似乎并不存在。当我点击提交发送我的电子邮件时，'email'变量会发送，但'band'变为空。我的错误在哪里？

HTML列表

<div class="artistn"> <li class="highlight" id="Mitski"> <span class="left gone">Mitski</span> <audio controls> <source src="songs/exsong.mp3" type="audio/mpeg"> <source src="songs/exsong.mp3" type="audio/ogg"> <embed height="50" width="100" src="horse.mp3"> </audio> </li> <li id="AdultMom"> <span class="left">Adult Mom</span> <audio controls> <source src="songs/exsong.mp3" type="audio/mpeg"> <source src="songs/exsong.mp3" type="audio/ogg"> <embed height="50" width="100" src="horse.mp3"> </audio> </li> </div>

HTML表格

<form method="post" action="js/sendmail.php"> <label> Your Email </label> <input type="text" name="email"></input> <input id="submit" type="submit" value="Submit" class="button"> </form>

JS

$( "li" ).click(function() { $('.highlight').removeClass('highlight'); $( this ).toggleClass( "highlight" ); var tBand = jQuery(this).attr('id'); alert(tBand); $("#submit").click(function(){ alert(tBand); $.ajax({url: "sendmail.php", type: "post", data: {"tBand": tBand}}) }); });

PHP

$email = $_POST['email']; $band = $_POST['tBand']; mail("example@email.com", "Subject Title",$band,"From: $email"); header("Location: ../index.php"); alert('success');

I am trying to send the ID of an element, stored in a variable to my PHP file, but it's not sending it. The alerts in my JS file go off, so the problem doesn't seem to be there. When I hit submit to send my email, the 'email' variable does send but the 'band' goes empty. Where could my error be?

HTML LIST

<div class="artistn"> <li class="highlight" id="Mitski"> <span class="left gone">Mitski</span> <audio controls> <source src="songs/exsong.mp3" type="audio/mpeg"> <source src="songs/exsong.mp3" type="audio/ogg"> <embed height="50" width="100" src="horse.mp3"> </audio> </li> <li id="AdultMom"> <span class="left">Adult Mom</span> <audio controls> <source src="songs/exsong.mp3" type="audio/mpeg"> <source src="songs/exsong.mp3" type="audio/ogg"> <embed height="50" width="100" src="horse.mp3"> </audio> </li> </div>

HTML FORM

<form method="post" action="js/sendmail.php"> <label> Your Email </label> <input type="text" name="email"></input> <input id="submit" type="submit" value="Submit" class="button"> </form>

JS

$( "li" ).click(function() { $('.highlight').removeClass('highlight'); $( this ).toggleClass( "highlight" ); var tBand = jQuery(this).attr('id'); alert(tBand); $("#submit").click(function(){ alert(tBand); $.ajax({url: "sendmail.php", type: "post", data: {"tBand": tBand}}) }); });

PHP

$email = $_POST['email']; $band = $_POST['tBand']; mail("example@email.com", "Subject Title",$band,"From: $email"); header("Location: ../index.php"); alert('success');

最满意答案

您没有通过Ajax调用将数据发送到服务器，表单正在提交。您需要取消表单提交。你也没有发送电子邮件，只有tBand。

$("#submit").click(function(e){ e.preventDefault(); $.ajax({ url: "sendmail.php", type: "post", data: { "tBand": tBand, "email", $("[name='email']").val() } }); });

如果您多次分配，也可能需要删除该单击

$("#submit").off("click").on("click", function(e){

You are not sending the data to the server with the Ajax call, the form is submitting. You need to cancel the form submission. Also you are not sending up the email, only tBand.

$("#submit").click(function(e){ e.preventDefault(); $.ajax({ url: "sendmail.php", type: "post", data: { "tBand": tBand, "email", $("[name='email']").val() } }); });

Also you probably want to remove the click if you are assigning it multiple times

$("#submit").off("click").on("click", function(e){

更多推荐