防止默认值在我的代码中不起作用答案

【问题标题】：Prevent default is not working in my code防止默认值在我的代码中不起作用
【发布时间】：2020-02-03 07:54:12
【问题描述】：

您好，我正在使用 php 开发 wordpress 网站，我想为单个 php 文件执行 4 个步骤。如果满足条件，它将转到下一页。

function checketudesandformations() {
  var x = document.getElementById("myTable").rows.length;

  if (x < 3) {
    alert("Please Select atleast 2 documents'");
    document.location.reload(true);
    return false;
  } else {
    //return true;
  }

如果满足以上条件，则只有在 jquery 下方想要触发，但我正在按钮触发条件不满足。所以请任何人帮助我

<script type="text/javascript">
  jQuery(document).ready(function() {
    jQuery("#suivantsteps2").click(function(e) {
      e.preventDefault();
      jQuery("#candidaturetabform2").css("display", "none");
      jQuery("#candidaturetabform3").css("page-break-before", "always");
      jQuery("#candidaturetabform3").css("display", "block");
      jQuery("#step03").addClass("active")
      jQuery("#step02").removeClass("active")

      return false;
    });
  });
</script>

在我的 HTML 代码下方

<form name="etudesandformations" id="etudesandformations" method="post" 
  enctype="multipart/form-data" action="#"  style="margin-top: 40px;">
    <table width="100%" border="0" cellpadding="0" cellspacing="0">

    <tr>
      <td align="center" valign="top">
       <table width="100%" border="0" cellpadding="0" cellspacing="0">
        <tr>
          <td></td>
        <tr>
           <td>
                <input name="inesv6" type="hidden" value="">
                  <table width="100%" border="0" cellpadding="5" cellspacing="0">
                  <tr>
                   <td width="50%" align="right">
                       <input  class="saisie1 input"  name="precedent" id="precedent" type="submit" value="Pr&eacute;c&eacute;dent" onClick="" tabindex="5">
                </td>
                 <td align="left">
                <input  class="saisie1 input" name="suivantsteps" id="suivantsteps2" type="submit" value="Suivant" onClick="checketudesandformations()" tabindex="4">
               </td>
              </tr>
           </td>
        </tr>
       </table>

【问题讨论】：

即使经过 Adiga 的编辑，我也无法理解这个问题。 checketudesandformations 怎么称呼？该函数与 jQuery 就绪函数有何关系？
您还需要显示 HTML 代码，以及您在表单中默认阻止的内容。
这里有两个单独的“点击”处理程序是没有意义的。将它们全部合并为一个功能，它将更易于管理。另外...如果用户没有选择至少 2 个文档，为什么要重新加载整个页面？如果他们因为一个错误而不得不重新输入所有数据，那将会严重惹恼您的用户。
哦，您为什么要使用表格进行布局？这是 1990 年代的技术。使用 CSS 和 divs / flexbox / something-else-modern-and-responsive 来控制页面的外观。表格冗长且不灵活，旨在显示数据行，而不是塑造整个页面 - 此外，如果您这样做，使用屏幕阅读器等的人会感到困惑。
我不知道如何合并那个函数，所以请给出一些示例代码

标签： javascript php jquery wordpress

【解决方案1】：

我没有正确理解问题，但您需要先纠正您的代码。对 onclick 事件使用单个事件处理程序，如下所示。如果您需要更多帮助，请至少为您的代码创建最小的工作小提琴。

<script type="text/javascript">
function checketudesandformations() {
  var x = document.getElementById("myTable").rows.length;

  if (x < 3) {
    alert("Please Select atleast 2 documents'");
    document.location.reload(true);

  } else {
    jQuery("#candidaturetabform2").css("display", "none");
      jQuery("#candidaturetabform3").css("page-break-before", "always");
      jQuery("#candidaturetabform3").css("display", "block");
      jQuery("#step03").addClass("active")
      jQuery("#step02").removeClass("active")
  }

</script>

【讨论】：