dongshuo5101 2016-05-03 18:18
浏览 47
已采纳

如何在同一个php页面上显示和隐藏多个表单[关闭]

I have four type forms to show on the same page based on the value selected in Dropdown. if

Condition 1: If Rear Tire and 2WD Selected i want to show form name= "RA"

enter image description here

Condition 1: If Rear Tire and MFWD Selected i want to show form name= "RB" enter image description here

Condition 1: If Front Tire and MFWD Selected i want to show form name= "FA" enter image description here

Condition 1: If Front Tire and 2WD Selected i want to show form name= "FB" enter image description here

I get it to work by creating Multiple pages but that make the page load slow and not friendly rather i want to load based on the selected values on the same page

  • 写回答

5条回答 默认 最新

  • dongronge3732 2016-05-03 18:57
    关注
    <select class="FrontRearTire">
        <option value="">Select Tire</option>
        <option value="RearTire">Rear Tyre</option>
        <option value="FrontTire">Front Tire</option>
    </select>
    
    <select class="TractorType">
        <option value="">Select Tractor</option>
        <option value="2WD">2WD</option>
        <option value="MFWD">MFWD</option>
    </select>
    
    <div class="RearTire2WD" style="display:none;">
        <form>RearTire2WD</form>
    </div>
    
    <div class="RearTireMFWD" style="display:none;">
        <form>RearTireMFWD</form>
    </div>
    
    <div class="FrontTire2WD" style="display:none;">
        <form>FrontTire2WD</form>
    </div>
    
    <div class="FrontTireMFWD" style="display:none;">
        <form>FrontTireMFWD</form>
    </div>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.2/jquery.min.js"></script>
    <script>
        $('.FrontRearTire').change(function(){
            var frontRearTire= $('.FrontRearTire').val();
            var tractorType= $('.TractorType').val();
            show(frontRearTire,tractorType);
        });
        $('.TractorType').change(function(){
            var frontRearTire= $('.FrontRearTire').val();
            var tractorType= $('.TractorType').val();
            show(frontRearTire,tractorType);
        });
        function show(frontRearTire,tractorType){
            var showDiv = "."+frontRearTire+tractorType;
            $(showDiv).show().siblings("div").hide();
        }
    </script>
    

    Giving Description in few minutes.

    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论
查看更多回答(4条)

报告相同问题?

悬赏问题

  • ¥15 求差集那个函数有问题,有无佬可以解决
  • ¥15 【提问】基于Invest的水源涵养
  • ¥20 微信网友居然可以通过vx号找到我绑的手机号
  • ¥15 寻一个支付宝扫码远程授权登录的软件助手app
  • ¥15 解riccati方程组
  • ¥15 display:none;样式在嵌套结构中的已设置了display样式的元素上不起作用?
  • ¥15 使用rabbitMQ 消息队列作为url源进行多线程爬取时,总有几个url没有处理的问题。
  • ¥15 Ubuntu在安装序列比对软件STAR时出现报错如何解决
  • ¥50 树莓派安卓APK系统签名
  • ¥65 汇编语言除法溢出问题