Как объединить две кнопки «Отправить» на форуме в одну кнопку - PullRequest
0 голосов
/ 23 сентября 2019

Ниже я прикрепил код.

Я хочу удалить одну кнопку «Отправить сейчас» и объединить со второй кнопкой.Можно ли обойтись без влияния на кодирование переключателей и форума?

Я хочу удалить 1 кнопку, чтобы обе формы отправлялись этой кнопкой.

Помещение обеих форм в одну кнопку "Отправить",Удаление одной кнопки.Ни один не работает

document.addEventListener('click', function(event) {
  let submitBtn = document.getElementById("submitBtn");
  if (event.target.type === "radio" && event.target.name === "number") {
    submitBtn.removeAttribute("disabled");
  }
});

function getCheckedValue(radioObj) {
  if (!radioObj)
    return "";
  var radioLength = radioObj.length;
  if (radioLength == undefined)
    if (radioObj.checked)
      return radioObj.value;
    else
      return "";
  for (var i = 0; i < radioLength; i++) {
    if (radioObj[i].checked) {
      return radioObj[i].value;
    }
  }
  return "";
}

// set the radio button with the given value as being checked
// do nothing if there are no radio buttons
// if the given value does not exist, all the radio buttons
// are reset to unchecked
function setCheckedValue(radioObj, newValue) {
  if (!radioObj)
    return;
  var radioLength = radioObj.length;
  if (radioLength == undefined) {
    radioObj.checked = (radioObj.value == newValue.toString());
    return;
  }
  for (var i = 0; i < radioLength; i++) {
    radioObj[i].checked = false;
    if (radioObj[i].value == newValue.toString()) {
      radioObj[i].checked = true;
    }
  }
}
.widget.ContactForm {
  z-index: 1
}

.contact-form-widget {
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  max-width: 98%;
  padding: 25px 0;
  border: 1px solid #b2b2b2;
  -webkit-border-radius: 2%;
  -moz-border-radius: 2%;
  border-radius: 3px;
}

.contact-form-widget .form {
  width: 91%;
  margin: 0 auto
}

.ribbon {
  font: 20px Arial;
  text-transform: capitalize;
  position: center;
  background: #6B5F53;
  color: #fff;
  text-align: center;
  padding: 7px 0 7px 0;
  margin: 0 0 3px 0;
  border-radius: 5px;
}

.contactf-name,
.contactf-email,
.contactf-message {
  text-align: left;
  margin-top: 25px;
  color: #000;
  font-size: 13px;
  font-weight: 600
}

.contactf-name,
.contactf-email {
  float: left;
  width: 100%
}

.contact-form-name,
.contact-form-email,
.contact-form-email-message,
.contact-form-name:hover,
.contact-form-name:focus,
.contact-form-email:hover,
.contact-form-email:focus,
.contact-form-email-message:hover,
.contact-form-email-message:focus {
  width: 100%;
  max-width: 100%;
  margin: 10px 0 0;
  padding: 10px;
  font-size: 12px;
  color: #aaa;
  border-color: #cccccc;
  border-top: 1px solid #666666;
  border-left: 1px solid #666666;
  border-width: 1px;
  box-shadow: none;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px
}

.contact-form-name,
.contact-form-email {
  height: 35px
}

.contact-form-email-message {
  height: 100px
}

.contact-form-button-submit,
.contact-form-button-submit:hover {
  margin-top: 25px;
  padding: 0 35px 0 35px;
  height: 37px;
  font: bold 18px Arial;
  outline: none;
  letter-spacing: 1px;
  color: #fff;
  text-align: center;
  cursor: pointer;
  color: #333333;
  background: #d2d2d2;
}

.contact-form-button-submit:active {
  color: #333333;
  border: 1px solid #d6a437;
  background: #febd4b;
  background: -webkit-gradient(linear, 0 0, 0 100%, from(#febd4b) to(#fed970));
  background: -webkit-linear-gradient(#febd4b, #fed970);
  background: -moz-linear-gradient(#febd4b, #fed970);
  background: -ms-linear-gradient(#febd4b, #fed970);
  background: -o-linear-gradient(#febd4b, #fed970);
  background: linear-gradient(#febd4b, #fed970);
  -pie-background: linear-gradient(#febd4b, #fed970)
}

.contact-form-cross {
  border: medium none !important;
  box-shadow: none !important;
  padding: 0 !important;
  height: 11px !important;
  width: 11px !important;
}

input[type=radio] {
  -webkit-appearance: radio;
  -O-appearance: radio;
  -moz-appearance: radio;
  opacity: 1;
}

#header .bottom-header.blog h1 {
  font-size: 64px;
  color: red
}

input[type=radio]:hover+label {
  border: solid 1px white;
  padding: 5px;
  border-radius: 1px;
  border-color: red;
  color: red;
  opacity: 1;
}

input[type=radio]:checked+label {
  border: solid 2px white;
  padding: 5px;
  border-radius: 1px;
  border-color: red;
  color: red;
  opacity: 1;
}

input[type=text] {
  font-weight: bold;
}

input[type=text]:hover {}

input[type=email]:hover {}
<div class="widget ContactForm" id="ContactForm22">
  <div class="ribbon"><strong>Your Billing Details</strong></div>
  <div class="contact-form-widget">
    <div class="form">
      <form name="contact-form">
        <div class="contactf-name">Your name <span style="color:red">*</span> :<input class="contact-form-name" id="ContactForm1_contact-form-name" name="Full Name" size="30" type="text" value="Full Name" onblur='if (this.value == "") {this.value = "Full Name";}' onfocus='if (this.value == "Full Name") {this.value = "";}'
          /></div>
        <div class="contactf-email">E-mail address <span style="color:red">*</span> :<input class="contact-form-email" id="ContactForm1_contact-form-email" name="E-mail address" size="30" type="text" value="E-mail address" onblur='if (this.value == "") {this.value = "E-mail address";}'
            onfocus='if (this.value == "E-mail address") {this.value = "";}' /></div>
        <div style="clear:both"></div>
        <div class="contactf-message">Your Address <span style="color:red">*</span> :<textarea class="contact-form-email-message" cols="25" id="ContactForm1_contact-form-email-message" name="Hometown/ City/ Your State...." rows="5" value="" placeholder="Hometown/ City/ Your State...."
            value="Hometown/ City/ Your State...." onblur='if (this.value == "") {this.value = "Hometown/ City/ Your State....";}' onfocus='if (this.value == "Hometown/ City/ Your State....") {this.value = "";}'></textarea>
          <input class="contact-form-button contact-form-button-submit" id="ContactForm1_contact-form-submit" type="button" value="Submit Now" />
          <div class="contact-form-error-message" id="ContactForm1_contact-form-error-message"></div>
        </div>
      </form>
    </div>
  </div>
</div>
<form name="radioExampleForm" method="get" action="" onsubmit="return false;">
  <p>&nbsp;<label for="number0"><input type="radio" value="http://www.paypal.com" name="number"     id="number0"> Pay by Paypal</label></br>
    &nbsp;<label for="number1"><input type="radio" value="http://www.instamojo.com" name="number" id="number1"> Pay by InstaMojo</label></br>
    &nbsp;<label for="number2"><input type="radio" value="http://www.skrill.com" name="number" id="number2"> Pay by Skrill</label></br>
  </p>
  <input type="button" id="submitBtn" disabled onclick="window.open(getCheckedValue(document.forms['radioExampleForm'].elements['number']), '_blank');" value="Submit Now">
</form>
...