javascript - 如何使用按钮同时单击 anchor 链接上的事件来提交表单？

Question

我有一个带有按钮来提交它。现在我想将相同的变量传递到另一个页面以将它们插入数据库中。为此，我想使用带有 id 的 GET 的 anchor 链接来传递变量。

但是如何向表单添加 anchor 链接，当我使用按钮提交表单时， anchor 链接也会被触发。

function splitAndResolve() {
  var errorIds = [];
  $('[name="error-selection-checkboxes"]:checked').each(function() {
    errorIds.push($(this).val().split("-")[1]);
  });

  var taskVersion = 1;

  if (errorIds.length > 0 && errorIds.length < $('[name="error-selection-checkboxes"]').length) {
    var dataObj = {
      'errorReportIdsToRemove': errorIds,
      'user': 'user@mail.com'
    };

    var baseUrl = $(location).attr("href").substring(0, $(location).attr("href").lastIndexOf('/') + 1);
    var splitTaskResponse = $.ajax({
      url: "/task/3f2456c6b44c3b29c651f8d55c1bb34ac4da11bb6d605a00629e79f2a95c4a70/split",
      type: "POST",
      data: dataObj,
      async: false,
      error: function(xhr, status) {
        if (xhr.status == 400) {
          window.location.href = "/400";
          alert("Failed resolving the task, please retry upon reload.");
        } else {
          window.location.href = "/500";
          alert("Failed resolving the task, please retry upon reload.");
        }
      }
    }).responseJSON;

    var taskId = splitTaskResponse.newTaskId;

    // We need to update the version without which version on the UI and the DB are different.
    taskVersion = splitTaskResponse.currentTaskPostSplit.version;
    window.open(baseUrl + taskId, '_blank');
  }

  dataObj = {
    'taskResolutionStatus': $("#inputResolution").val(),
    'taskResolutionStatusDetail': $("#inputResolutionDetail").val(),
    'taskResolutionNote': $("#inputNotes").val(),
    'changeset': $("#inputChangeset").val(),
    'requiresReview': $("#requiresReviewCheckBox").is(':checked'),
    'version': taskVersion
  };

  $.ajax({
    url: "/task/3f2456c6b44c3b29c651f8d55c1bb34ac4da11bb6d605a00629e79f2a95c4a70",
    type: "POST",
    data: dataObj,
    async: false,
    error: function(xhr, status) {
      if (xhr.status == 400) {
        window.location.href = "/400";
        alert("Failed resolving the task, please retry upon reload.");
      } else {
        window.location.href = "/500";
        alert("Failed resolving the task, please retry upon reload.");
      }
    }
  });

  enableStatusDropdown();
  return true;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<form class="form-horizontal clearfix" onsubmit="return splitAndResolve()">
  <div class="form-group">
    <label for="changeset" class="col-sm-2 control-label">Changeset</label>
    <div class="col-sm-10">
      <input class="form-control" type="text" name="changeset" id="inputChangeset" readonly="">
    </div>
  </div>
  <div class="form-group">
    <label for="taskResolutionStatus" class="col-sm-2 control-label">Resolution</label>
    <div class="col-sm-10">
      <select class="form-control resolutionDropdown" name="taskResolutionStatus" id="inputResolution">
        <option disabled="" selected="" value=""> -- Choose one -- </option>
        <option value="ESCALATE">Escalate</option>
        <option value="ALREADY_FIXED_IN_OSM">Already fixed in osm</option>
        <option value="NOT_ENOUGH_INFORMATION">Not enough information</option>
        <option value="NO_FIX_REQUIRED">No fix required</option>
        <option value="FIXED">Fixed</option>
      </select>
    </div>
  </div>
  <div class="form-group" id="inputResolutionDetailDropdown">
    <label for="taskResolutionStatusDetail" class="col-sm-2 control-label">Detail</label>
    <div class="col-sm-10">
      <select class="form-control resolutionDropdown" name="taskResolutionStatusDetail" id="inputResolutionDetail">
        <option value="LOW_PRIORITY_AREA">Low priority area</option>
        <option value="KNOWN_BUG">Known bug</option>
        <option value="ERROR_BASED_ON_BAD_DATA">Error based on bad data</option>
        <option value="TRUE_EXCEPTION">True exception</option>
      </select>
    </div>
  </div>
  <div class="form-group">
    <label for="taskResolutionNote" class="col-sm-2 control-label">Notes</label>
    <div class="col-sm-10">
      <textarea class="form-control" name="taskResolutionNote" id="inputNotes" rows="3"></textarea>
    </div>
  </div>
  <div class="form-group">
    <label for="requiresReview" class="col-sm-2 control-label">Requires review</label>
    <div class="col-sm-2">
      <input class="form-control" name="requiresReview" type="checkbox" style="box-shadow: none" id="requiresReviewCheckBox">
    </div>
  </div>
  <input id="taskResolutionButton" type="submit" class="btn btn-primary">
  <button id="taskCancelButton" type="button" class="btn btn-default" onclick="hideResolutionOverlay()">Cancel</button>
</form>

Answer 1

 <input id="taskResolutionButton" type="submit" class="btn btn-primary" onclick="$('#your_form_id').submit();>