2010-11-22 11 views
0

私は、フォームを送信するためにJavaScriptを使用して、ハイパーリンク/画像ボタンを持ってJavascriptを/ jQueryのチェックボックスの条件付きのハイパーリンク

<p> 
    <a href="#" onclick="checkOutFrm.submit();"> 
    <img src="images/btn-checkout-basket.gif" width="169" height="28" alt="Checkout" border="0" /> 
    </a> 
</p> 

、それが確認されるまで、ハイパーリンクを無効にします]チェックボックスを追加したいと思います。これをどうやってやりますか?

大歓迎任意のヘルプ、S.

+0

ハイパーリンクを無効にすることはできませんあなたはそれを隠すことができますが。 – Sarfraz

+1

@Sarfraz:いつでもリンクを無効にすることができます... –

答えて

1

あなたは、いけない、一般的には:

  1. は(あなたのHTMLマークアップにあなたをあなたのJavaScriptをミックスロジックハン​​ドラをプログラムでアタッチする必要があります)
  2. (ab)JavaScriptのアンカー要素のみを使用する(あなたは、単一の要素(あなたの代わりに、フォームのonsubmitイベントを処理する必要があります)のクリックでフォームの提出ハンドラをボタンを使用するか、直接IMG上onclickハンドラを置く)、また
  3. 配置する必要があります。

    window.onload = function(){ 
        var accept = document.getElementById('accept-box'); 
        var submit = document.getElementById('submitter'); 
        accept.onclick=function(){ 
        submit.disabled = !accept.checked; 
        }; 
        document.getElementById('myform').onsubmit = function(){ 
        // Prevent form submission by any means unless 
        // the accept button is checked. 
        return accept.checked; 
        }; 
    }; 
    
    :あなたのsubmit.jsファイルで

    <!-- Put a valid doctype here --> 
    <html><head> 
        <script type="text/javascript" src="submit.js"></script> 
    </head><body> 
        <form id="myform" ...> 
        <label> 
         <input type="checkbox" name="accept" id="accept-box" /> 
         I accept 
        </label> 
        <button type="submit" id="submitter" disabled="disabled"> 
         <img src="..." /> 
        </button> 
        </form> 
    </body></html> 
    

    ...と、この:

私はあなたの状況の詳細を知らないが、私はあなたのHTMLファイルでこれを行うだろう

(実際、私は物事のJS側を処理するために個人的にjQueryを使用します:)

$(function(){ 
    $('#accept-box').click(function(){ 
    $('#submitter').attr('disabled',!this.checked); 
    }); 
    $('#myform').submit(function(){ 
    return $('#accept-box').attr('checked'); 
    }); 
}); 

あなたが好きなら、画像の周囲のボタンを離しスタイルをCSSを使用することができます。

#submitter { border:0; padding:0 } 
+0

それは素晴らしい、多くの、多くの、多くの感謝、S – ss888

1

データを送信する前に、まずチェックボックスの値を確認できます。

<a href="javascript: if(getElementById('CheckBoxID').checked) { checkOutFrm.submit(); } else { return false; }"> 

あなたはjQueryのを使用している場合は、むしろそれをこのようにしてください:

$(function(){ 
    $("a").click(function(e){ 
     e.preventDefault(); 
     $("#CheckBoxID").val() && $("form").submit(); 
    }); 
}); 
+0

多くのおかげさまでしたが、私はそれを働かせることができず、Phrogzのアドバイスを使用して終了しました。とにかくありがとうございます。 – ss888

+0

このコードは100%正確ではないかもしれませんが、それは正しい方法であなたを指し示すためのものです。 –

関連する問題