python 输入框查询_前端实现输入框input输入时，调用后台查询。

最新推荐文章于 2022-11-21 15:36:35 发布
最新推荐文章于 2022-11-21 15:36:35 发布
阅读量1.3k 收藏
点赞数
文章标签： python 输入框查询
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_39966130/article/details/111750660
版权
本文介绍了如何在前端HTML页面中，使用jQuery和Bootstrap框架，通过监听input事件，实现在输入框内输入时实时调用后台进行模糊查询。详细讲述了绑定事件处理函数、清除下拉菜单、发送异步请求获取数据以及加载菜单的过程，实现了输入内容变化即触发查询的功能，避免了全局键盘监听带来的问题。
摘要由CSDN通过智能技术生成

这几天做了一个前端html页面，基于bootstrap框架开发，里面有个需求就是在输入框中输入字母或者文字时，下拉框自动刷新模糊查询出的信息。最初我的想法是监控键盘上的按键输入，每次输入一个字母后，发送异步请求至服务端进行数据查询。但是后来发现，这种方式做出来会有一个问题，就是这个监控是全局的，也就是页面刷新后，只要你按键盘，就会调用异步请求发送数据，这样跟我的设计思路是有出入的。

然后我查了很多资料，发现有一种方式可以监控某个输入框体中的变化，只要框体内容有变化，就会触发函数。具体实现如下。

首先先写好前端html，前端开发时先引入jquery和bootstrap相关组件：

电子发票相关

电子发票申请与下载

保单号

产品代码

最低0.47元/天 解锁文章
weixin_39966130
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
文本域输入内容在一定间隔时间段才触发事件查询数据方法
linli1991的博客
04-23 489
文本域输入内容在一定间隔时间段才触发事件查询数据方法 var flag = 0; var t; function openFlag () { clearTimeout(t); flag = 0; } function closeFlag(callback, param1, param2, param3) { t = setTimeout(function(){flag...
python怎么接收前端参数_Django项目中前端序列化参数获取
weixin_32019949的博客
02-20 548
我的网站：Python爬虫人工智能学习教程​www.python88.cn最近在写一个django的web项目，后端代码基本都已经写好了，主要是前端，以前学过一段前端，只是对一些基本的方法知道，但还有很多东西不熟练，问题是在遇到表单数据时候，如何对参数整体打包发送后端接口，查阅相关资料发现一些知识点和方法，分享给大家，虽然我发现技术类文章阅读量比标题党文章低的多，但是还是要坚持分享原创技术文章，能...
【JavaWeb】前端input输入框+后台查询+input框自动提示相关信息（类似搜索框的功能）
coralime的博客
05-22 8222
Bug记录： #1-> weui-cells_form 会导致 weui-cell__ft 占用空间变成0 使用了WeUI的列表样式，如下图所示 <div class="weui-cells__title">带图标、说明、跳转的列表项</div> <div class="weui-cells"> <a class="weui-cell weui-cell_access" href="javascript:;"> &lt
java的插入排序
weixin_50773203的博客
10-03 210
/* * * a、默认从第二个数据开始比较。　 * b、如果第二个数据比第一个小，则交换。然后在用第三个数据比较，如果比前面小，则插入（狡猾）。否则，退出循环 * c、说明：默认将第一数据看成有序列表，后面无序的列表循环每一个数据，如果比前面的数据小则插入（交换）。否则退出。 * */ public class InterSortText { public static void main(String[] args) { int arr[] = {7, 5, 3, 2,
Python前后端交互（ Flask & Ajax ）
m0_57193008的博客
04-17 1万+
Python前后端交互（ Flask & Ajax ）
Python弹出输入框并获取输入值的实例
09-19
这个`getInput`函数可以方便地在任何需要弹出输入框的地方调用。例如： ```python input_value = getInput('请输入内容', '请在这里输入你想要的内容:') print('你输入的是：', input_value) ``` 以上就是Python...
python实现键盘输入的实操方法
09-19
本文将详细介绍如何在Python中实现键盘输入，并探讨两种主要的内置函数：`raw_input`（Python 2.x）和`input`（Python 3.x）。 首先，让我们从创建Python项目开始。在你的计算机上打开Python集成开发环境（IDE），...
xm.py.tar.gz_python_python 自动测试_python 表单
09-19
在Python编程领域，自动化测试是提高开发效率和代码质量的重要工具。本压缩包"xm.py.tar.gz"包含了一些用于Python自动测试的脚本，特别是针对Web表单的自动化提交。让我们详细探讨一下其中涉及的关键知识点。 首先...
《自拍教程49》Python_adb批量字符输入
12-21
在Android系统的测试中，尤其是对终端产品或应用程序的输入框功能进行边界值测试时，我们需要确保输入框能够正确处理各种输入情况。例如，检查WiFi热点名称输入框的最大字符限制，或者搜索框对输入长度的处理。为了...
【JavaScript源代码】element input输入框自动获取焦点的实现.docx
12-28
在JavaScript和Vue.js开发中，有时我们需要实现一种功能，即当页面加载或特定事件发生时，使输入框（input）自动获取焦点。这样的需求在创建表单或评论系统时尤其常见，用户可以直接开始输入而无需手动点击输入框。...
python的前端和后端_前端与后端的数据交互（jquery ajax+python flask）
weixin_39575047的博客
11-20 1465
前端与后端的数据交互，最常用的就是GET、POST，比较常用的用法是：提交表单数据到后端，后端返回json前端的数据发送与接收1）提交表单数据2）提交JSON数据后端的数据接收与响应1）接收GET请求数据2）接收POST请求数据3）响应请求前端的数据发送与接收1. 提交表单数据# GET请求var data = {"name": "test","age": 1};$.ajax({type: 'GE...
python使用flask实现前后端分离&通过前端修改数据库数据【全栈开发基础】
前端、python爱好者
11-21 2585
完整代码放到了最后，时间紧张的话直接拉到最后或点击目录【🥩 完整代码】
实现input输入后几秒后请求，类似百度搜索
zhyaiqq123的博客
08-02 8661
今天面试面试官问了个问题，大概就是实现input输入几秒后请求将返回的数据放入div中，这里难点就是input框什么时候发起请求，事件节流这个词也是才接触，后来自己百度并做了相应的demo验证实现，将过程记录如下： &lt;!DOCTYPE html&gt; &lt;html&gt; &lt;head&gt; &lt;title&gt;实现input输入5秒后请求，类似百度那样搜素---事件...
python flask 框架后端如何获取前端的表单数据 文本 单选框 多选框
weixin_33832340的博客
04-24 3550
一、 文本域和单选按钮前端 文本域和单选按钮表单获取方法一样<formclass="form-horizontal"method="post"> <divclass="form-group"> <labelfor="username"class="col-sm-2control-label">Userna...
python爬虫和前端（部分）
qq_56630044的博客
08-11 752
获取网络数据（公开的网络）
Python学生信息录入和查询
热门推荐
往事流年的博客
04-13 2万+
目录   学生信息录入简介 代码实现 效果展示 学生信息录入简介 *首先要先对学生的信息进行大量录入的操作 *操作完成后要考虑查询状态当查询学生不存在要给出错误提示 *查询成功后进入输出该学生的相关信息 代码实现 class QException(Exception):#自定义输入编号异常   def __init__(self):#异常类的构造函数       print(...
记录开发中遇到的坑和经验 ------前端篇
06-15 615
1、重复提交表单 场景：点击某个按钮后，后台可能要反应一会，此刻，用户误以为没有点击，可能又点击了一次。导致操作执行两次。涉及到数据操作的就会重复插入。 解决方案：
aspose html转pdf_Python办公自动化（八）使用Python转换PDF，Word/Excel/PPT/md/HTML都能转！...
weixin_39724441的博客
11-27 201
↑关注 + 星标，后台回复【大礼包】送你Python自学大礼同一个操作执行两次，就要考虑自动化！大家好，又到了Python办公自动化专题。今天讲的是各位一定会接触到的PDF转换，关于各种格式的文件转换为PDF有很多第三方工具与网站可以实现，但是使用Python的好处不仅可以批量转换，同时一旦脚本写完了以后就可以一键执行，彻底解放双手，那么本文就来盘一盘如何使用Python来将Word...
Python实现使用tkinter弹出输入框输入数字, 具有确定输入和清除功能
最新发布
06-12
可以使用tkinter中的simpledialog模块来实现弹出输入框输入数字的功能，代码如下： ```python import tkinter as tk from tkinter import simpledialog classDialog(simpledialog.Dialog): def __init__(self, parent, title, prompt): self.prompt = prompt self.result = None super().__init__(parent, title=title) def body(self, frame): tk.Label(frame, text=self.prompt).pack() self.entry = tk.Entry(frame) self.entry.pack() return self.entry def apply(self): try: self.result = int(self.entry.get()) except ValueError: self.result = None def show_input_dialog(prompt): root = tk.Tk() root.withdraw() dialog = InputDialog(root, 'Input', prompt) return dialog.result def on_ok(): input_value = show_input_dialog('Please enter a number:') if input_value is not None: print('Input:', input_value) def on_clear(): print('Clear') root = tk.Tk() tk.Button(root, text='Input', command=on_ok).pack(side=tk.LEFT) tk.Button(root, text='Clear', command=on_clear).pack(side=tk.LEFT) root.mainloop() ``` 在这个程序中，我们定义了一个InputDialog类，继承自simpledialog.Dialog类，用于弹出输入框，输入数字。show_input_dialog函数用于调用InputDialog类，返回输入的数字。 我们还定义了两个按钮，分别用于确定输入和清除输入。当点击确定按钮时，调用show_input_dialog函数获取输入的数字，如果输入的是数字，就打印出来；否则不做任何操作。当点击清除按钮时，打印出"Clear"。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值