weui-switch开关控件,表单提交后如何取值

最近在学习weui这个框架,做了一些小的试验,发现weui-switch控件直接提交不能获取到表单信息,在segmentfault上发现也有人提了这个问题,有人说可以设置一个隐含标签来捕获开关的状态,试了一下,确实可以,把我自己的解决方法写下来如下:

weui这个switch开关控件好像确实只能用来显示开关状态,无法提交数据,我根据楼上的思路,建了一个隐藏的radio标签,然后通过这个开关控件来设置radio标签的value属性,这样提交,后台php就能获取到正确的表单信息了:

 <!--隐含元素,用于接收按钮的状态,一定要设置成checked提交才有效,否则提交的信息无法被php获取-->
        <input hidden="hidden" id="btn" name="btn1" type="radio" value="off" checked="checked" />

        <div class="weui-cells weui-cells_form">
            <div class="weui-cell weui-cell_switch">
                <div class="weui-cell__bd">开关1</div>
                <div class="weui-cell__ft">
                    <input class="weui-switch" type="checkbox" id="button1" name="button1" />

                </div>
            </div>
        </div>
        <script>
            $(function () {
                $("#button1").bind("click", function () {

//                    console.log( $("#button1").val() );

                    if($("#btn").val()=="off"){

                        $("#btn").val("on");
                        console.log("开关1当前状态:"+$("#btn").val());

                    }else{

                        $("#btn").val("off");
                        console.log("开关1当前状态:"+$("#btn").val());
                    }

                });
            });
        </script>

时间: 2024-10-13 01:33:07

weui-switch开关控件,表单提交后如何取值的相关文章

[转载]WebBrowser控件表单(form)的自动填写和提交

话说有了WebBrowser类,终于不用自己手动封装SHDocVw的AxWebBrowser这个ActiveX控件了.这个类如果仅仅作为一个和IE一模一样浏览器,那就太没意思了(还不如直接用IE呢).那么,无论我们是想做一个"定制版IE",还是希望利用HTML来做用户界面(指WinApp而非WebApp.许多单机软件,包括Windows的帮助支持中心,都是HTML做的),都少不了Windows Form和包含在WebBrowser中的Web页面的交互.本文将通过几个实际的例子,初步介绍

如何清空IE下file文件控件表单里面的值

在IE下由于安全的策略,没法通过$(":file").val('')来清空里面上传的值.那我们只能通过克隆节点的方法来实现清空. 如下: var file = $(":file"); file.after(file.clone().val("")); file.remove(); 这样就可以清空里面的值了. 如何清空IE下file文件控件表单里面的值

PHP关于表单提交 后 post get分页

PHP关于表单提交后分页函数的那点事--POST表单分页实现 phpfunctionclass加密inputjavascript 说到分页,其实你在Google一搜一大把.大部是通过GET实现,还有的是利用数据库查询的Limit来实现分页.当然表单也可以通过GET方式来提交,实现分页,就得把实现分页需用到参数用GET方式附在URL后面如这样: http://127.0.0.1/search.php?page=1&参数1=参数1值 当然我们有的时候并不想让别人知道我们要提交什么东东,要解决这一问题

struts2 jsp表单提交后保留表单中输入框中的值 下拉框select与input

原文地址:struts2 jsp表单提交后保留表单中输入框中的值 下拉框select与input jsp页面 1     function dosearch() {2         if ($("#textValue").val() == "") {3                 $("#errortip").html("<font color='#FF0000'>请输入查询内容</font>")

怎么实现form表单提交后不重新刷新当前页面

怎么实现表单提交后不重新刷新当前页面 如何实现表单提交后不重新刷新当前页面 <form name='form1' id='form1' action='/xbcw/cw/xx_xx.action' method='post'> <input type="button" id="btnSubmit" name="btnSubmit" value="保存" onclick="addKp()"

form表单提交后保持输入的值

1.form表单提交后,继续保持原来输入的值 <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <meta charset="UTF-8"> <title>form表单提交后保持输入的值</title> </head> <body> <form class="form

自定义switch开关控件,实现点击和滑动效果

效果图 1. xml布局中 <com.etoury.etoury.ui.view.SlideSwitch android:id="@+id/slideSwitch3" android:layout_width="wrap_content" android:layout_height="wrap_content" /> 2. SlideSwitch.java package com.etoury.etoury.ui.view; impo

iframe+javascript实现一个表单提交后多个处理文件按序处理

最近在弄一个网页的问题,总结如下. [问题描述] 页面中包括以下几个部分:1)表单form,供用户输入图片文件:2)iframe1,显示a.php文件的内容,a.php接收客户端图片并保存,后台程序处理图片,生成相关数据文件:3)iframe2,显示b.php文件的内容,b.php读取结果文件对其进行分页显示: [实现思路] 以上功能主要在于两个问题: 1,form表单提交的形式一般是:input type="sumit"的表单元素配合form的action地址完成提交.此处要求先用a

Jquery表单提交后获取返回Json值

1.给form添加id值: <form action="/News/SaveMessage" method="post" accept-charset="utf-8" class="form" id="frm-reg" name="frm-reg"> 设置所有input标签的name属性值为数据库的字段值,即可以传值到后台 2.给提交按钮添加id值: <input cl