-4

私はjQueryとPHPが初めてです。私は自分自身を試しましたが、以下の出力を取得する方法がわかりません。誰かがこれを調べてくれませんか？

私はこれを達成しようとしています: http://jsfiddle.net/exttq/

つまり、Form1とForm2は前にのみ表示されますが、ボックスをオンまたはオフにした後にのみ、それらを開いたり閉じたりします

この PHP 関数コードの何が問題になっていますか?

function eshop_extras_checkout($echo){


    $echo .= '

    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script> 

    <script>

    $(".formGroup").hide();
    $("#chooseForm input:checkbox").on("change", function() {
        if($(this).is(":checked")) {
            $("#" + $(this).val()).show();
        }
        else {
            $("#" + $(this).val()).hide();
        }
    });
    ​
</script>';

    $echo .= '<fieldset class="eshop eshop_extra">' . "\n";


    $echo .= ' <form id="chooseForm">
        <input type="checkbox" name="form1" value="form1"> Form1<br>
        <input type="checkbox" name="form1" value="form2"> Form2<br>
    </form>

    <form id="form1" class="formGroup">
        <h2>FORM 1</h2>
        <label>Name</label><input type="text"> <br>
        <label>Address</label><input type="text">
    </form>

    <form id="form2" class="formGroup">
        <h2>FORM 2</h2>
        <label>Username</label><input type="text"> <br>
    </form>';


    $echo .= '<legend>Articles Order Form</legend>' . "\n";



    return $echo;
}
4

1 に答える 1

1

私が観察した最初のことは、スクリプトが DOM の HTML の前にあるということです..それを DOM Ready Handler に入れて、もう一度試してみることをお勧めします..

<script>
  $(document).ready(function() {
       $(".formGroup").hide();
       $("body").on("change","#chooseForm input:checkbox" ,function() {
           if($(this).is(":checked")) {
                $("#" + $(this).val()).show();
            }
            else {
              $("#" + $(this).val()).hide();
           }
       });
   });
</script>'
于 2012-10-19T22:39:05.287 に答える