Question

我是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;
}

Answer 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>'

请解决这个jQuery问题

1 个答案: