使用javascript,html和ajax发送电子邮件

时间:2017-05-16 15:04:21

标签: javascript html ajax

我的格式是HTML:

<form name="form" class="form" role="form" action="index.php" method="post">
  <div class="container">
    <div class="row" id="row1">

      <div class="col-xs-12 col-sm-12 col-md-6 col-lg-4 col-xl-2 col-lg-offset-2 text-center">
        <!--<img class="map-class" src="imgs/primaudine_mappa.svg">-->

      </div>

      <div class="col-xs-12 col-sm-12 col-md-6 col-lg-4 col-xl-2 form-class">
        <div class="row">
          <div class="col-sm-12">

            <div class="form-group">
              <!-- drop down menu -->
              <label for="sel1">Seleziona Area:</label>
              <span class="error">* <!--<?php echo $nameErr;?> --> </span>
              <select class="form-control" id="sel1" name="region" required>
                                            <option selected="selected" disabled="disabled" value="">Seleziona la tua zona</option>
                                            <option value="region1">1 - Udine Centro</option>
                                            <option value="region2">2 - Rizzi / S. Domenico / Cormor / S. Rocco</option> 
                                            <option value="region3">3 - Laipacco / San Gottardo</option>
                                            <option value="region4">4 - Udine sud</option>
                                            <option value="region5">5 - Cussignacco</option>
                                            <option value="region6">6 - S. Paolo / S. Osvaldo</option>
                                            <option value="region7">7 - Chiavris / Paderno</option>
                                    </select>
            </div>
          </div>
        </div>

        <div class="row">
          <div class="col-xs-12 col-sm-12 col-md-12">
            <div class="form-group">
              <label for="usr">Mail personale</label>
              <span class="error">* <!-- <?php echo $nameErr;?></span> -->
              <input name="mail" type="email" class="form-control" id="usr" placeholder="es. mariorossi@gmail.com" required>
            </div>
          </div>
        </div>

        <div class="row">

          <div class="col-xs-8 col-sm-8 col-md-8 form-group">
            <label for="usr">Nome e Cognome</label>
            <span class="error">* <!-- <?php echo $nameErr;?></span> -->
            <!-- codice per nomi e cognomi ^([ \u00c0-\u01ffa-zA-Z'\-])+$ -->
            <input pattern="^([ \u00c0-\u01ffa-zA-Z'\-])+$" title="Solo caratteri es. Mario Rossi" name="nome" type="text" class="form-control" id="usr" placeholder="es. Mario Rossi" required>
          </div>
          <div class="col-xs-4 col-sm-4 col-md-4 form-group">
            <label for="usr">Età</label>
            <span class="error">* <!-- <?php echo $nameErr;?></span> -->
            <input name="eta" type="number" min="16" max="99" class="form-control" id="usr" placeholder="es. 35" required>
          </div>
        </div>

        <div class="row">
          <div class="cols-xs-12 col-sm-12 col-md-12">
            <div class="form-group">
              <label for="comment">Inserisci la tua segnalazione o i tuoi spunti</label>
              <span class="error">* <!-- <?php echo $nameErr;?></span> -->
              <textarea name="commento" class="form-control" rows="7" id="comment" placeholder="Scrivi in questo campo" required></textarea>
              <p><span class="error">* campi richiesti</span></p>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>

  <div class="container">
    <div class="row">
      <div class="cols-xs-12 col-sm-12 col-md-12 button-class" style="text-align: center"><button name="submit" type="submit" class="btn" value="submit">Invia Segnalazione</button>

      </div>
    </div>
  </div>
</form>

然后,我将我的HTML表单与PHP中的电子邮件发件人代码相关联:

<?php 

            // L'INDIRIZZO DEL DESTINATARIO DELLA MAIL 
            $to = "my@email.com";

            // IL SOGGETTO DELLA MAIL 
            $subject = "Segnalazione da " . $_POST["nome"]; 

            // COSTRUIAMO IL CORPO DEL MESSAGGIO 
            $body = "Contenuto della segnalazione:\n\n"; 

            $body .= "Mail: " . trim(stripslashes($_POST["mail"])) . "\n"; 

            $body .= "Nome: " . trim(stripslashes($_POST["nome"])) . "\n"; 

            $body .= "Età: " . trim(stripslashes($_POST["eta"])) . "\n"; 

            $val_select = trim(stripslashes($_POST["region"]));
            if ($val_select == "region1") {
                $val_select = "Udine Centro";
            } else if ($val_select == "region2") {
                $val_select = "Rizzi / S. Domenico / Cormor / S. Rocco";
            } else if ($val_select == "region3") {
                $val_select = "Laipacco / San Gottardo";
            } else if ($val_select == "region4") {
                $val_select = "Udine sud";
            } else if ($val_select == "region5") {
                $val_select = "Cussignacco";
            } else if ($val_select == "region6") {
                $val_select = "S. Paolo / S. Osvaldo";
            } else if ($val_select == "region7") {
                $val_select = "Chiavris / Paderno";
            }

            $body .= "Area: " . $val_select . "\n"; 

            $body .= "Messaggio: " . trim(stripslashes($_POST["commento"])) . "\n";

            // INTESTAZIONI SUPPLEMENTARI 
            $header_from = "From: " . trim(stripslashes($_POST["nome"])) . " " . trim(stripslashes($_POST["mail"])) . " "; 

            // INVIO DELLA MAIL 
            if( $_POST["nome"] != "" && $_POST["commento"] != "" && $_POST["eta"] != "" && $_POST["region"] != ""){
                //echo "ciao!";
                //mail($to, $subject, $body, $header_from);
                mail($to, $subject, $body, 'Mail dal sito Prima Udine');
                //header("Location:https://www.google.com/");
                header( "Location: redirect.php");


            }
        ?>

但这种方法不起作用。所以我想改变方法。我希望使用Ajax将我的HTML表单与JavaScript代码连接以发送电子邮件。 我怎么能这样做?如果您需要更多信息,请问我,谢谢。 PS。我是新手,但我可以编写代码;)

更新:我试图解决php问题,检查我的答案。

1 个答案:

答案 0 :(得分:-1)

我试图修复我的PHP。目前,这是有效的。我在提交后重定向到另一个页面:

代码编辑:

if(count($_POST) == 0) {

			// L'INDIRIZZO DEL DESTINATARIO DELLA MAIL 
			$to = "llluca3.0@gmail.com";

			// IL SOGGETTO DELLA MAIL 
			$subject = "Segnalazione da " . $_POST["nome"]; 

			// COSTRUIAMO IL CORPO DEL MESSAGGIO 
			$body = "Contenuto della segnalazione:\n\n"; 

			$body .= "Mail: " . trim(stripslashes($_POST["mail"])) . "\n"; 

			$body .= "Nome: " . trim(stripslashes($_POST["nome"])) . "\n"; 

			$body .= "Età: " . trim(stripslashes($_POST["eta"])) . "\n"; 

 			$val_select = trim(stripslashes($_POST["region"]));
			if ($val_select == "region1") {
				$val_select = "Udine Centro";
			} else if ($val_select == "region2") {
				$val_select = "Rizzi / S. Domenico / Cormor / S. Rocco";
			} else if ($val_select == "region3") {
				$val_select = "Laipacco / San Gottardo";
			} else if ($val_select == "region4") {
				$val_select = "Udine sud";
			} else if ($val_select == "region5") {
				$val_select = "Cussignacco";
			} else if ($val_select == "region6") {
				$val_select = "S. Paolo / S. Osvaldo";
			} else if ($val_select == "region7") {
				$val_select = "Chiavris / Paderno";
			}
			
			$body .= "Area: " . $val_select . "\n"; 

			$body .= "Messaggio: " . trim(stripslashes($_POST["commento"])) . "\n";

			// INTESTAZIONI SUPPLEMENTARI 
			$header_from = "From: " . trim(stripslashes($_POST["nome"])) . " " . trim(stripslashes($_POST["mail"])) . " "; 

			// INVIO DELLA MAIL 
			if( $_POST["nome"] != "" && $_POST["commento"] != "" && $_POST["eta"] != "" && $_POST["region"] != ""){
				//echo "ciao!";
				//mail($to, $subject, $body, $header_from);
				mail($to, $subject, $body, 'Mail dal sito Prima Udine');
				//header("Location:https://www.google.com/");
				//header( "Location: redirect.php");
			}
		} else ( count($_POST) > 1 ) {
           
	        /* ... process form here ... */
	         
	        /* prevent re-posting prompt 
	            by redirecting to same url with a 303 status */
	        header("Location: redirect.php");
	        exit;
        }

新代码是:

<?php 

		if(count($_POST) == 0) {

    /* my old code */
		
    }
		} else ( count($_POST) > 1 ) {
           
	        /* ... process form here ... */
	         
	        /* prevent re-posting prompt 
	            by redirecting to same url with a 303 status */
	        header("Location: redirect.php");
	        exit;
        }

		?>