nat_pagle 2022-04-12 21:19 采纳率: 66.7%
浏览 57
已结题

flask如何使用jquery只用checkbox向后端传值


<form>
    开启/关闭
        <div >
        <input type='checkbox' id= 'kaiguan'>
        <label for='jiami'>开启/关闭</label>
    </div>
模式    <select  id="mode" name="mode" >
                   <option>---请选模式---</option>
                   <option value="0">模式1</option>
                   <option value="1">模式2</option>
    </select>
<br>
选项1:    <select  id="1" name="1" >
                   <option>---请选择码率---</option>
                   <option value="1">1</option>
                   <option value="2">2</option>
                  <option value="3">3</option>
                   <option value="4">4</option>
                <option value="5">5</option>
                   <option value="6">6</option>

    </select>
<script>
    var PIN={};
        PIN.mode=$('#mode').val();
        PIN.1=$('#1').val();

   
        


</script>

    </form>

如何不使用button,直接在checkbox选中时会向后端发送一次select中mode和1的值,打印出来;取消选中时也会发送一次mode和1的值,打印

  • 写回答

2条回答 默认 最新

  • CSDN专家-showbo 2022-04-12 21:51
    关注

    添加change事件用ajax发送数据就行,示例代码如下

    img


    demo.py

    from flask import Flask, request,render_template
    import json
    
    app = Flask(__name__, static_url_path='')
    
    #直接显示
    @app.route('/')
    def index():
        return render_template("demo.html")
    
    @app.route("/api/login",methods=["get","post"])
    def login():
        str1 = str(request.values.get("1"))
        mode = str(request.values.get("mode"))
        print(str1,mode)
        return str1+"\n"+mode
     
      
    app.run('0.0.0.0', port=8001,debug=True)
    
    

    templates/demo.html

    <form>
        开启/关闭
        <div>
            <input type='checkbox' id='kaiguan'>
            <label for='jiami'>开启/关闭</label>
        </div>
        模式    <select id="mode" name="mode">
            <option>---请选模式---</option>
            <option value="0">模式1</option>
            <option value="1">模式2</option>
        </select>
        <br>
        选项1:    <select id="1" name="1">
            <option>---请选择码率---</option>
            <option value="1">1</option>
            <option value="2">2</option>
            <option value="3">3</option>
            <option value="4">4</option>
            <option value="5">5</option>
            <option value="6">6</option>
    
        </select>
        <script src="https://g.csdnimg.cn/??lib/jquery/1.12.4/jquery.min.js"></script>
        <script>
            $('#kaiguan').change(function () {
                $.ajax({
                    url: '网址',
                    data: $(this.form).serialize(),
                    complete: function (xhr) {
                        alert('服务器端返回内容\n'+xhr.responseText)
                    }
                })
    
            })
    
    
        </script>
    
    </form>
    
    

    img

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

报告相同问题?

问题事件

  • 系统已结题 4月23日
  • 已采纳回答 4月15日
  • 创建了问题 4月12日

悬赏问题

  • ¥15 状态机/汽车转向灯/Sateflow
  • ¥15 这个有点复杂 有没有人看看
  • ¥15 用python如何确定子孙元素在父元素中的位置
  • ¥15 obj文件滤除异常高程
  • ¥15 用mathematicas或者matlab计算三重积分
  • ¥15 Loop unrolling的runtime计算
  • ¥100 NVMe-oF的Target端,开启attr_offload后,测试失败。
  • ¥100 有偿照片马赛克去掉,保留原始数据
  • ¥15 c# winform http报错,如何解决?
  • ¥15 统计软件及应用-r软件