JS切换表单

最新推荐文章于 2022-09-21 14:23:11 发布

原创最新推荐文章于 2022-09-21 14:23:11 发布 · 1.2k 阅读

0 ·

CC 4.0 BY-SA版权

js 专栏收录该内容

44 篇文章

订阅专栏

本文介绍了如何使用JavaScript实现动态切换表单的功能，通过代码示例详细解析了切换过程中的事件处理和DOM操作技巧，帮助开发者提升前端交互体验。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

<script type="text/javascript">
        $(document).ready(function(){           
            showpay();            
        });

         function showpay() {
            var paytypeinfo=$("#paytypeinfo option:selected").val();
            console.log(paytypeinfo)
            if (paytypeinfo == '1') {
                $('#volume').show();
                $('#price').hide();
            }else{
                $('#volume').hide();
                $('#price').show();

                // document.getElementById('volume').style.display = 'none';
                // document.getElementById('price').style.display = 'inline';
                
            }
        }
      </script>

<tr>
                    <td>结算方式：</td>
                    <td>
                        <select id="paytypeinfo" name="data[pay_status]" style="font-size:16px; padding:5px;" onchange="showpay()">
                            <option <eq name="projectinfo.paytype" value="1" >selected</eq> value="1">单量+单价</option>
                            <option <eq name="projectinfo.paytype" value="2" >selected</eq> value="2">时长+时价</option>
                            
                        </select>
                        <span id="volume">
                                
                            单量<input type="text"  name="data[ordernumber]" id="ordernumber" value="{$projectinfo[ordernumber]}" class="box" style="width:60px;">
                              
                            单价<input type="text"  name="data[single_price]" id="single_price" value="{$projectinfo[single_price]}" class="box" style="width:60px;">

                        </span>

                        <span id="price">
                                
                            时长<input type="text"  name="data[time_long]" id="time_long" value="{$projectinfo[time_long]}" class="box" style="width:60px;">
                              
                            时价<input type="text"  name="data[time_price]" id="time_price" value="{$projectinfo[time_price]}" class="box" style="width:60px;">
                        </span>
                    </td>
                </tr>