0

これは、私が尋ねた以前の質問に関連しています: Hide / Show Multiple Divs

以前の質問からコードを配置しましたが、チケットの選択が行われた「後」にドロップダウンの値を変更する場合を除いて、問題なく動作しているようです。

私はいくつかのJavascriptsを配置しているので、どこかに衝突があるのではないかと思っていますか? コードの最初のビットは、ドキュメントの HEAD にあります。

<head>
    <script type="text/javascript">
        $(function() {
            $('.cat_dropdown').change(function() {
                $('#payMethod').toggle($(this).val() >= 2);
            });
        });     
    </script>
    <script type="text/javascript">
        $(document).ready(function () {
            $(".paymentmethod").click(function () {
                $(".paymentinfo").hide();
                switch ($(this).val()) {
                    case "Credit Card Authorisation":
                        $("#pay0").show("slow");
                        break;
                    case "Direct Deposit":
                        $("#pay1").show("slow");
                        break;
                    case "Cash Payment (FAA Office)":
                        $("#pay2").show("slow");
                        break;
                }
            });
        });
    </script>
</head>

コードのこの 2 番目のセクションは、フォームの検証です。

        <script src="/CatalystScripts/ValidationFunctions.js" type="text/javascript"></script>
        <script type="text/javascript">
            //<![CDATA[
            var submitcount27389 = 0;function checkWholeForm27389(theForm){
            var why = "";
            if (theForm.FirstName) why += isEmpty(theForm.FirstName.value, "First Name"); 
            if (theForm.LastName) why += isEmpty(theForm.LastName.value, "Last Name");
            if (theForm.HomeAddress) why += isEmpty(theForm.HomeAddress.value, "Home Address"); 
            if (theForm.HomeCity) why += isEmpty(theForm.HomeCity.value, "Home City"); 
            if (theForm.HomeState) why += isEmpty(theForm.HomeState.value, "Home State"); 
            if (theForm.HomeZip) why += isEmpty(theForm.HomeZip.value, "Home Zipcode"); 
            if (theForm.HomeCountry) why += checkDropdown(theForm.HomeCountry.value, "Home Country"); 
            if (theForm.EmailAddress) why += checkEmail(theForm.EmailAddress.value); 
            if (theForm.HomePhone) why += isEmpty(theForm.HomePhone.value, "Home Phone Number"); 
            if (theForm.CAT_Custom_266106) why += checkDropdown(theForm.CAT_Custom_266106.value, "Available Dates:");
            if (theForm.CAT_Custom_266143) why += checkDropdown(theForm.CAT_Custom_266143.value, "Member Tickets:");
            if (theForm.CAT_Custom_266107) why += checkDropdown(theForm.CAT_Custom_266107.value, "Guest Tickets:");
            if (theForm.CAT_Custom_266105 && theForm.CAT_Custom_266107.value != "1") 
                why += checkSelected(theForm.CAT_Custom_266105, "Payment Options:");
            if (theForm.CAT_Custom_266104) why += checkDropdown(theForm.CAT_Custom_266104.value, "Where did you hear about us?");
            if (theForm.CaptchaV2) why += captchaIsInvalid(theForm, "Enter Word Verification in box below", "Please enter the correct Word Verification as seen in the image"); if(why != ""){
                alert(why);
                return false;
            }
            if(submitcount27389 == 0){
                submitcount27389++;
                theForm.submit();
                return false;
            }else{
                alert("Form submission is in progress.");
                return false;
            }
            }
            //]]>
        </script>
    </form>

テストして結果を確認したい場合は、 http://www.faa.net.au/test/femmes-event-rego-form.htmlでページを見つけることができます。

複数のゲストを選択し、次にクレジットカード承認を選択し、最後に「どこで私たちのことを知りましたか?」で何かを選択する必要があります。何が起こるかを確認するためのドロップダウン。

最後のドロップダウン メニューで値を変更すると、DIV が非表示になる理由がわかりません。

私は JSFiddle を追加しました - http://jsfiddle.net/4REan/ - しかし、私はそれを正しく動作させることはできませんが、そこにあるすべてのコードでうまくいくことを願っています??

4

1 に答える 1

1

支払い方法 (div) のトグル機能にわずかな誤りがありました。修正しました。修正された js コードは正常に動作します。

JS コード:

$(function () {
// $('.cat_dropdown').change(function () { //Commented as it was generic call
$('#CAT_Custom_266107').change(function () { //added for specific call
    alert($(this).val());
    $('#payMethod').toggle($(this).val() >= 2);
});
});

 $(document).ready(function () {
  $(".paymentmethod").click(function () {
    $(".paymentinfo").hide();
    switch ($(this).val()) {
        case "Credit Card Authorisation":
            $("#pay0").show("slow");
            break;
        case "Direct Deposit":
            $("#pay1").show("slow");
            break;
        case "Cash Payment (FAA Office)":
            $("#pay2").show("slow");
            break;
      }
     });
    });

$(document).ready(function () {

var submitcount27389 = 0;

function checkWholeForm27389(theForm) {

    var why = "";
    if (theForm.FirstName) why += isEmpty(theForm.FirstName.value, "First Name");
    if (theForm.LastName) why += isEmpty(theForm.LastName.value, "Last Name");
    if (theForm.HomeAddress) why += isEmpty(theForm.HomeAddress.value, "Home Address");
    if (theForm.HomeCity) why += isEmpty(theForm.HomeCity.value, "Home City");
    if (theForm.HomeState) why += isEmpty(theForm.HomeState.value, "Home State");
    if (theForm.HomeZip) why += isEmpty(theForm.HomeZip.value, "Home Zipcode");
    if (theForm.HomeCountry) why += checkDropdown(theForm.HomeCountry.value, "Home Country");
    if (theForm.EmailAddress) why += checkEmail(theForm.EmailAddress.value);
    if (theForm.HomePhone) why += isEmpty(theForm.HomePhone.value, "Home Phone Number");
    if (theForm.CAT_Custom_266106) why += checkDropdown(theForm.CAT_Custom_266106.value, "Available Dates:");
    if (theForm.CAT_Custom_266143) why += checkDropdown(theForm.CAT_Custom_266143.value, "Member Tickets:");
    if (theForm.CAT_Custom_266107) why += checkDropdown(theForm.CAT_Custom_266107.value, "Guest Tickets:");
    if (theForm.CAT_Custom_266105 && theForm.CAT_Custom_266107.value != "1") why += checkSelected(theForm.CAT_Custom_266105, "Payment Options:");
    if (theForm.CAT_Custom_266104) {

        why += checkDropdown(theForm.CAT_Custom_266104.value, "Where did you hear about us?");

    }
    if (theForm.CaptchaV2) why += captchaIsInvalid(theForm, "Enter Word Verification in box below", "Please enter the correct Word Verification as seen in the image");
    if (why != "") {
        alert(why);
        return false;
    }
    if (submitcount27389 == 0) {
        submitcount27389++;
        theForm.submit();
        return false;
    } else {
        alert("Form submission is in progress.");
        return false;
    }
}
 });

ここにLIVE DEMOの js フィドルがあります

jQueryを介して実行したい機能が何であれ、単一の「$(document).ready(function () { .... } );」の下に追加することをお勧めします。または「$(関数 () { ...} );」（両方の構文が有効です）、これを複数回追加したことをコードで確認したため、ボディのロード時にすべてを実行するため、これはブラウザにとって問題ではありません。しかし、これは LOC とその冗長コードを増加させるため、コーディングの悪い習慣です。次回は避けてください。

ハッピーコーディング:)

于 2013-07-26T05:54:05.950 に答える