Question

提交表单后，我无法移至下一页。

我有一个表格，用户可以输入他们的地址和手机号码。有验证，如果有效，则详细信息和当前日期存储在本地存储中。

$("#deliveryform").validate({
    rules:{
      txtpostalcode:{
        required: true,
        number: true,
        minlength: 6,
        maxlength: 6,
      },
      txtaddressline1:{
        required: true,
      },
      txtmobilenumber:{
        required:true,
        number: true,
        minlength: 8,
        maxlength: 8,
      }
    },

  });

$("#paymentbtn").bind('click',function(){
    if ($("#deliveryform").valid()) {
      submitaddress();
      alert("good");
      window.location = "payment.html";

    }
 });

function submitaddress() {
var postalcode =  $("#txtpostalcode").val();
var address = $("#txtaddressline1").val() + " " +  
$("#txtaddressline2").val();
var mobilenumber = $("#txtmobilenumber").val();

var currentdate = new Date();
var dd = currentdate.getDate();
var mm = currentdate.getMonth()+1; //January is 0!
var yyyy = currentdate.getFullYear();

if(dd<10) {
  dd = '0'+dd
}

if(mm<10) {
  mm = '0'+mm
}

currentdate = yyyy + '/' + mm + '/' + dd   ;

localStorage.setItem("postalcode", postalcode);
localStorage.setItem("address", address);
localStorage.setItem("mobilenumber", mobilenumber);
localStorage.setItem("currentdate", currentdate);
}

我的html代码

<div class="deliveryoption">

<form action="" id="deliveryform" >

<div class = "deliveryaddress">

 <div class="form-group">Enter Delivery Address</div>
<div class="form-group col-form-1">
  <input class="form-control" type="tel" maxlength="6" name="txtpostalcode" id="txtpostalcode" placeholder="Postal Code"/>
</div>

<div class="form-group col-form-1">
  <input class="form-control" type="text" name="txtaddressline1" id="txtaddressline1" placeholder="Address Line 1"/>
</div>

<div class="form-group col-form-1">
  <input class="form-control" type="text" name="txtaddressline2" id="txtaddressline2" placeholder="Address Line 2(Optional)"/>
</div>

<div class="form-group col-form-1">
  <input class="form-control" type="tel" maxlength="8" name="txtmobilenumber" id="txtmobilenumber" placeholder="Mobile Number"/>
</div>

</div>

<div class="form-group col-form-1"><button class="btn btn-block" 
id="paymentbtn"><b>PROCEED TO PAYMENT</b></button></div>

</div>

我希望页面将详细信息设置到本地存储中，然后转到下一页“ payment.html”。

Answer 1

使用 window.location.href =“”;

$("#paymentbtn").bind('click',function(){
if ($("#deliveryform").valid()) {
  submitaddress();
  alert("good");
  window.location.href = "payment.html";

}  });

Answer 2

console.log（$（“＃deliveryform”）。valid（））并检查其是否返回true。
删除警报（“好”）
尝试使用完整路径而不是页面（例如www.example.com/payment.html）作为位置

Answer 3

使用 window.location.assign 代替window.location。

$("#paymentbtn").bind('click',function(){
    if ($("#deliveryform").valid()) {
      submitaddress();
      window.location.assign = "https://www.yourwebsitename.com/payment.html";
    }
 });

引用为here

window.location无法与我的功能一起使用

3 个答案: