Question

我正在尝试根据用户在复选框中选择的选项将用户发送到不同的网页/网址。我尝试了一切，但似乎无法找出正确的“if语句”来做到这一点。不确定实现这一目标的最简单方法是什么。请帮助！

以下是表单的HTML代码：

 <!-- Register start -->
    <section id="register">

        <div class="container">
          <div class="row">
            <div class="col-md-12">
              <h2>Register Now</h2>
            </div>
          </div> 
          <div class="row registration-success-msg">
            <div class="col-md-12">
              <div class="alert alert-success"><strong>Congratulations!</strong> Your registration was successful.</div>
            </div>
          </div>
          <div class="row validation-error-msg">
            <div class="col-md-12">
              <div class="alert alert-danger">Please check your data! All fields are required.</div>
            </div>
          </div>
<!-- Checkboxes Start Here -->
          <div class="row">
           <div class="col-md-6 plans">
             <h3>1. Select your Plan</h3>
             <div class="plan">
               <div class="checkbox">
                 <i class="fa fa-square-o" name="Option1"></i>
               </div>
               <div class="offer">
                 <h4>1 DAY TICKET  <span class="label">$ 29.00</span></h4>
                 <p>Here is some dummy text. You can also use tooltips. on top, but you can have it on the bottom too! </p> 
               </div>
             </div>
             <div class="plan">
               <div class="checkbox">
                 <i class="fa fa-square-o" name="Option2"></i>
               </div>
               <div class="offer">
                 <h4>2 DAYS TICKET  <span class="label">$ 39.00</span></h4>
                 <p>Here is some dummy text. You can also use tooltips. on top, but you can have it on the bottom too! </p> 
               </div>
             </div>
             <div class="plan">
               <div class="checkbox">
                 <i class="fa fa-square-o" name="Option3"></i>
               </div>
               <div class="offer">
                 <h4>3 DAYS TICKET  <span class="label">$ 49.00</span></h4>
                 <p>Here is some dummy text. You can also use tooltips. on top, but you can have it on the bottom too! </p> 
               </div>
             </div>
           </div>
<!-- Checkboxes END Here -->
           <div class="col-md-6 register-form">
             <h3>2. Enter your Personal information</h3>
             <form action="submit-forms.php" method="post">
              <input type="hidden" name="plan">
              <input type="hidden" name="type" value="registration">
               <div class="row">
                <div class="col-md-12">
                  <input type="text" name="first_name" class="form-control" placeholder="First Name">
                </div>
              </div>
              <div class="row">
                <div class="col-md-12">
                  <input type="text" name="last_name" class="form-control" placeholder="Last Name">
                </div>
              </div>
              <div class="row">
                <div class="col-md-12">
                  <input type="text" name="email" class="form-control" placeholder="Email">
                </div>
              </div>
              <div class="row">
                <div class="col-md-12">
                  <input type="text" name="address" class="form-control" placeholder="Address">
                </div>
              </div>
              <div class="row">
                <div class="col-md-12">
                  <input type="text" name="zip_code" class="form-control" placeholder="Zip Code">
                </div>
              </div>
              <div class="row">
                <div class="col-md-12">
                  <input type="text" name="city" class="form-control" placeholder="City">
                </div>
              </div>
              <div class="row">
                <div class="col-md-12">
                  <button class="btn btn-block btn-default" data-loading-text="Loading..." data-complete-text="Registration Successful!" id="submit-registration">Submit Registration</button>
                </div>
              </div>
            </form>
          </div>
        </div> 
      </div>
    </section>
    <!-- Register end -->

这是处理表单并发送到php文件的ajax表单：

var formData = $("#register form").serialize();

  // Send the Form
  $.ajax({
        //this is the php file that processes the data and send mail
        url: "submit-forms.php", 
        //POST method is used
        type: "POST",
        //pass the data     
        data: formData,
        //Do not cache the page
        cache: false,
        //success
        success: function(data) {
          //$("#submit-registration").button('complete');
          //$('.registration-success-msg').fadeIn("slow");
            console.log("success");
            window.location.href = 'http://link1goeshere.com';
        }
      });

这是PHP文件：

if('registration' == $submitType)
    {
        // prepare message
        $body  =    "You have got a new registration from your website : \n\n";
        $body .=    "First Name:  $_POST[first_name] \n\n";
        $body .=    "Last Name:  $_POST[last_name] \n\n";
        $body .=    "Email:  $_POST[email] \n\n";
        $body .=    "Address:  $_POST[address] \n\n";
        $body .=    "Zip Code:  $_POST[zip_code] \n\n";
        $body .=    "City:  $_POST[city] \n\n";
        $body .=    "Plan:  $_POST[plan] \n\n";

        if( $_POST['email'] && !preg_match( "/[\r\n]/", $_POST['email']) ) {
            $headers = "From: $_POST[email]";
        } else {
            $headers = "From: $youremail";
        }

        mail($youremail, 'New Registration', $body, $headers );


    }

Answer 1

~~首先，你的jQuery选择器不会匹配任何东西。~~

var formData = $("#register form").serialize();

您需要使用：

var formData = $("#register").find(form).serialize();

~~因为表单元素不是#register元素的直接chidl。~~

编辑：抱歉这是完全错误的，两者完全相同。

接下来，serialize（）将为您提供字符串'name = value＆amp; name2 = value2'等，而帖子数据应采用{name：value，name2：value2}的形式。

尝试serializeArray（）：

var formData = $("#register").find(form).serializeArray();
var postData = {};
formData.forEach(function (form) {
    postData[form.name] = form.value;
});
$.post('submit-forms.php', postData, function (data) {
    console.log(data);
    window.href.location = 'http://link1goeshere.com';
});

但是我仍然看不到复选框......

Ajax不同的复选框应该将用户发送到不同的页面

1 个答案: