0

関数から返されたブール値を使用してオプションが選択されていることを検証するフォームがあります。

<form  id="checkoutForm" action="https://www.paypal.com/cgi-bin/webscr" onsubmit="return validateForm()" method="post" name="paypal">

そして、私はこの標準の画像ボタンでフォームを送信していました：

<input name="submit" type="image"  src="https://www.paypal.com/en_US/i/btn/btn_xpressCheckout.gif" value="Checkout">

ただし、私は更新していて、代わりにCSSボタンを使用しているので、次のようにフォームを送信します。

 <a href="javascript:void(0)" style="float:right;" class="shopbutton" onclick="document.forms['checkoutForm'].submit();">Checkout with PayPal</a>

次のように標準ボタンを使用できます。

<input name="submit" type="submit"  class="shopbutton" value="Checkout">

しかし、これは私に他のいくつかの小さな問題を引き起こします、そして私はフォームが他の方法を使用して検証することを確実にする方法を知りたいですか？

TIA

<a href編集：タイプボタンを使用する場合、ボタンが<form>タグの外側で宣言されていることにも言及する必要があります。

4

3 に答える 3

1

javascriptを使用してフォームを直接onsubmit送信する場合は、をバイパスしています。これは、クライアント側の検証が悪い理由の一例です。

a問題の解決策の1つは、次のようにリンクを追加することです。

<a href="javascript:void(0)" style="float:right;" class="shopbutton" onclick="validateForm()">Checkout with PayPal</a>

次に、検証関数にエラーカウントを追加し、エラーが見つからなかった場合は関数内で次のように送信します。

function validateForm() {
    var errors = 0;
    if(inputFieldHere.value.length<3) errors++;
    if(errors) return false; //Or display some error or something
    else document.forms["checkoutForm"].submit();
}
于 2012-11-16T23:22:31.747 に答える
1

これを試して：

<!DOCTYPE html>
<html>
  <head>
    <title>element</title>
<script type="text/javascript">
  function checkme() {
        if (!document.form.agree.checked) {
            missinginfo = "You must agree to the Terms and Conditions\n Please tick the box and try again.";
            alert(missinginfo);
            return false;
        }
        else {
            alert("Text information");
            return true;
        }
    }

  function submit_form()
  {
        if(checkme() == true)
        {
            document.forms["form"].submit();
        }
  }
</script>
  </head>

  <body>
    <form name="form" id="form" method="post" action="#" onSubmit="return checkme();">
      <input type="checkbox" name="agree" id="agree" value="agree_terms" class="terms">
      <label for="agree">&nbsp;I&acute;ve read terms and conditions and I&acute;m ready to shop</label>
      <input type="submit" name="btnSubmit" value="Submit" class="submit">
    </form>
    <a href="#" style="float:right;" class="shopbutton" onclick="submit_form();">Submit form</a>
  </body>
</html>
于 2012-11-16T23:30:02.823 に答える
0

<input>フォーム内のボタンを非表示のままにしておくことをお勧めします（例：with style="display:none;"）。

このよう<a>にして、onclickでフォームを送信し続け、検証を適切に維持することができます（検証コードがフォーム内で何らかの理由を探しても驚かないでしょう<input type="submit" />）

于 2012-11-16T23:14:14.153 に答える