Question

我有3个按钮和1个表单。第一个按钮是新按钮。我要添加的按钮。当我点击这个新按钮时，我希望jQuery点击下一个按钮：第二个按钮：保存 - 单击此按钮时需要添加如下功能：

if($("#email").val().trim().length>0 && $("#customer_firstname").val().trim().length>0 && $("#customer_lastname").val().trim().length>0 )   {

如果这是有效的 - 表单保存成功jQuery需要点击第三个按钮（当这是无效停止到这里。其他js将在表单中显示错误）：第3个按钮：发送订单 - 点击后不需要任何东西。其他的js将完成其余的工作。

其他方式是使用“保存”按钮，如果有效点击“发送按钮” - 可能更多是解决方案吗？

    <p class="orderbutton">
        <input type="submit" class="order-button-opc" id="order-button" value="Order Button">
     </p>
    <p class="submit">
     <input type="submit" class="exclusive button" name="submitAccount" id="submitAccount" value="{l s='Save'}" />
    </p>
    <p class="cart_navigation" id="cart_navigation">
    <input type="submit" value="I confirm my order" class="extraorderbutton">
    </p>

我试试这个：

<script>
$(document).ready(function () {
var firstFormValid = false;
var isFormValid = false;
$('#order-button').click(function(){
    if(anycondition)
       firstFormValid = true;
});

$("#submitGuestAccount").click(function () {
     if(firstFormValid ) {
     if($("#email").val().trim().length>0 &&$("#customer_firstname").val().trim().length>0 && $("#customer_lastname").val().trim().length>0 )  {
         isFormValid = true;     
     } else isFormValid = false;
     } else firstFormValid =false; 
}); 

$("#order-button").click(function () {
   if(isValid && firstFormValid)
       $('#order-button').submit()
});
 });
  </script>

但我得到错误： enter image description here

Answer 1

使用这个希望会有所帮助。

$(document).ready(function () {
    var firstFormValid = false;
    var isFormValid = false;
    $('#newbutton').click(function(){
        if(anycondition)
           firstFormValid = true;
    });

    $("#savebutton").click(function () {
         if(firstFormValid ) {
         if($("#email").val().trim().length>0 &&$("#customer_firstname").val().trim().length>0 && $("#customer_lastname").val().trim().length>0 )  {
             isFormValid = true;     
         } else isFormValid = false;
         } else firstFormValid =false; 
    }); 

    $("#sendbutton").click(function () {
       if(isValid && firstFormValid)
           $('#FORMID').submit()
    });
});

Answer 2

您可以通过单独处理每个区域，而不仅仅是调试/抛出一些代码，可能对此和将来有所帮助吗？

声明元素/选择器
验证功能
表格'检查'功能
表格'保存'功能
事件处理程序。

说，

1）声明元素/选择器

var _inputemail = $("#email"),
_inputfirstname =$("#customer_firstname"),
_inputlastname = $("#customer_lastname"),
_button_check = $("#checkbutton"),
_button_send = $("#sendbutton"); /* hidden initially in css */

2）创建验证功能

function isValid() {
  var is=false;
   /* add in the checks */
  if(_inputemail.val().length>0) { is=true; }
  /* return true or false */
  return is;
}

3）形成'检查'功能

function checkForm() {
  /* use the validate function */
  if(isValid()) {
   /* show the 'save' button */
   _button_send.show();
  }
}

4）形成'发送'功能

function sendForm() {
  /* sendform here */
  if(isValid()) {
   /* we could run the validate again if we like  */
  }
}

5）事件处理程序

_button_check.on("click", checkForm);
_button_send.on("click", sendForm);

/* now we  have separate functions we can check/send 
  the form from other events too 

 eg. Checking as we type */
_inputlastname.on("keyup",checkForm);

现在有一些可重复使用/易于管理的“组件”

将在此代码中进行排序，但希望在某种程度上有所帮助！（？）

如何单击一个按钮，如果保存表单，则单击其他按钮

2 个答案: