首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
社区首页 >问答首页 >JQUERY未处理(onchange)函数

JQUERY未处理(onchange)函数
EN

Stack Overflow用户
提问于 2021-04-03 18:06:20
回答 2查看 28关注 0票数 0

我正在创建一个依赖项下拉列表,

当我将Id从一个函数传递给另一个函数时,它不起作用,下面是一些代码示例

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
<?php
include("includes/db.php");
?>
<!DOCTYPE html>
<html>
<head>
    <title></title>
     <script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
  <script src="https://stackpath.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js"></script>
</head>
<body>
<div>
    <select id="all_category">
        <option>select a category</option>
    </select>
</div>
<script type="text/javascript">
    $(document).ready(function(){
        category();
         function category(){
            $.ajax({
            url : "action.php",
            method : "POST",
            data : {category:1},
            success : function(data){
                $("#all_category").html(data)
            }
        })
    }
    $("#all_category").change(function () {
        var val = $(this).val();
        var xyz = $("#all_category option:selected").val();
        console.log("hello"+xyz)
    })
    })
</script>
</body>
</html>

这段代码是从API中获取数据,

当我从第一个下拉列表中打印ID时,

它只是在console.log中我的Id变量之前打印消息

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
<?php
include "../db.php";
if (isset($_POST["category"])) {
    $get_assign_course = "SELECT * FROM categories";
    $run_p_cats = mysqli_query($con,$get_assign_course);
    while ($rows=mysqli_fetch_array($run_p_cats)) {
        $cat_id  = $rows['cat_id '];
        $cat_title = $rows['cat_title'];
        echo "<option value='$cat_id '>$cat_title</option>
        ";}}
?>

这就是我的API帮助?

EN

回答 2

Stack Overflow用户

发布于 2021-04-03 18:14:49

尝试将其更改为:$(“#all_category”).change(函数为:

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
$("#all_category").on('change',function

或者试试这个:

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
$(document).on('change','#all_category',function(){

如果这对你有效,请告诉我

票数 0
EN

Stack Overflow用户

发布于 2021-04-03 18:42:39

当您在jQuery中使用.html()时,它将销毁事件上已经发生的任何绑定。这是因为html删除了DOM树,并用数据重新初始化它。

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
<script type="text/javascript">
  $(function() {
    $.ajax({
      url: "action.php",
      method: "POST",
      data: {category: 1},
      success: function (data) {
        $("#all_category").html(data);
        $("#all_category").on('change', function (evt) {
          console.log($(this).val())
        })
      }
    });
  });
</script>

要解决此问题,您需要在进行.html()调用后重新绑定。

票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/66934386

复制
相关文章
onchange事件
定义和用法 onchange 事件会在域的内容改变时发生。 语法 onchange="SomeJavaScriptCode" 参数 描述 SomeJavaScriptCode 必需。规定该事件发生时执行的 JavaScript。 支持该事件的 HTML 标签: <input type="text">,<select>, <textarea> 支持该事件的JavaScript 对象: fileUpload, select, text, textarea 实例 <div class="col-sm-6">
一觉睡到小时候
2019/07/04
1.8K0
了解 SwiftUI 的 onChange
从 iOS 14 开始,SwiftUI 为视图提供了 onChange 修饰器,通过使用 onChange,我们可以在视图中对特定的值进行观察,并在其更改时触发操作。本文将对 onChange 的特点、用法、注意事项以及替代方案做以介绍。
东坡肘子
2022/07/28
2.9K0
jQuery遍历函数
.closest():从元素本身開始,逐级向上级元素匹配。并返回最先匹配的祖先元素。
全栈程序员站长
2022/07/07
1.1K0
jquery定时执行函数_jquery自动提交
版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。
全栈程序员站长
2022/10/01
2.3K0
用户代码未处理MetadataException
最近在用EF搭框架的过程中,遇到了很多问题,大部分都是出现在配置文件中,比如说下面这个问题:
全栈程序员站长
2022/08/09
3120
用户代码未处理MetadataException
jQuery学习---入口函数
· window.onload函数必须等待网页全部加载完毕(包括 图片等),然后再执行里面的代码。
syy
2020/05/14
1.5K0
jQuery的animate函数
jQuery提供了一个animate函数,可以通过改变CSS属性来实现一些动画效果。
大江小浪
2018/07/25
1.7K0
jQuery函数的使用
上述代码将从Google的CDN中加载jQuery库。确保将其放在<head>标签或页面内容的顶部。
堕落飞鸟
2023/05/18
1.5K0
jQuery原理(入口函数)
var likeArr = { 0: "lnj", 1: "33", 2: "male", length: 3 };
Dreamy.TZK
2020/06/23
5.2K0
jQuery原理(入口函数)
JQuery 绑定select标签的onchange事件,弹出选择的值,并实现跳转、传参
参考文献 http://www.cnblogs.com/moli-/p/6406170.html
山河木马
2019/03/05
1.4K0
Jquery源码分析:初始化Jquery函数
今天我们来分析一下jquery的源码,从关于初始化jquery这个函数开始。版本:3.4.1
小明爱学习
2020/01/21
1.1K0
Jquery源码分析:初始化Jquery函数
今天我们来分析一下jquery的源码,从关于初始化jquery这个函数开始。版本:3.4.1
小明爱学习
2020/07/08
1.4K0
统计字数oninput?keyup?onchange?
当元素的值发生改变时,会触发change事件。该事件仅适用于<input>, <select>和<textarea> 元素。当用于<select>元素时,change 事件会在选择某个选项时发生。当用于<input>或<textarea>时,该事件会在元素失去焦点时发生。
奋飛
2019/08/15
2.7K0
jquery学习-- Day 1(引用jquery和入口函数)
jsdeliver -query引用地址:https://cdn.jsdelivr.net/npm/jquery@3.5.1/dist/jquery.min.js
meowrain
2021/04/22
9030
jquery学习-- Day 1(引用jquery和入口函数)
使用jQuery封装实用函数
一、引言 项目开发中,前端会有一个辅助工具类的js文件,比如cookie的操作,团队成员自己封装的方法。大多数时候,我们开发人员自己都是写一个全局函数,不考虑后期维护人员也会写相同的代码,然后造成代码之间的冲突。之前维护的一段代码如下: var g=function(id){ return document.getElementById(id); }; var $$=function(id){ return document.getElementById(id); }; g("testdi
八哥
2018/01/18
1.3K0
jQuery入口函数的写法
需要引入jQuery文件 入口函数的标准 在<head> </head>标签中,jQuery入口函数必须要写,在<body> </body>可以不写,写上入口函数后不论放在哪个标签下都能去执行。一般建议在body标签中写入口函数,就是为了等页面加载完成后才执行入口函数。 案例: js的入口函数执行要比jQuery的入口函数执行得晚一些。 jquery的入口函数会等待页面的加载完成才执行,但是不会等待图片的加载。 js的入口函数会等待页面加载完成,并且等待图片加载完成才开始执行 <!DOCTYPE
兮动人
2021/06/11
1.2K0
jQuery1.0.1 -- jQuery1.0.2 之函数表达式与函数声明
在介绍这一内容之前,先说下声明提前,函数声明提前是函数声明和函数表达式的重要区别。
用户7293182
2022/01/06
3860
jQuery1.0.1 -- jQuery1.0.2 之函数表达式与函数声明
jquery教程之属性操作函数
prop 是针对元素本身就带有的固有属性,比如id class title name checked等
老雷PHP全栈开发
2020/07/02
8010
第69天:jQuery入口函数
Js方式 :document.getElementById(“id”).onclick
半指温柔乐
2018/09/11
7750
第69天:jQuery入口函数
JQuery中bind和unbind函数
测试: 页面代码: <body> <input type="button" name="aaa" value="点击我"> <input type="checkbox" name="checkbox1"> </body> JQuery代码: $().ready(function(){ for (var i = 0; i < 3; i++) { $("input[type='button']").click(function(){ alert("aaaa"); }); } } alert("aaaa")会执行三次,在事件嵌套事件中,不希望看到这样的情况,需要把上层事件禁用,此时可引入bind和unbind函数解决。 引入函数: for (var i = 0; i < 3; i++) { $("input[type='button']").unbind("click"); $("input[type='button']").bind("click", function(){ alert("aaa"); }); } alert("aaa");仅执行一次。 bind() 方法为被选元素添加一个或多个事件处理程序,并规定事件发生时运行的函数 unbind() 方法移除被选元素的事件处理程序。能够移除所有的或被选的事件处理程序,或者当事件发生时终止指定函数的运行。 event 是事件类型,类型包括:blur、flcus、load、resize、scroll、unload、click、dblclikc、mousedown、mouseup、mousemove、mouseover、mouseout、mouseenter、mouseleave、change、select、submit、keydown、keypress、keyup和error等,当然也可以是自定义名称。 data 为可选参数,作文event.data属性值传递给事件对象的额外数据对象。 function 是用来绑定的处理函数。 语法: $(selector).bind(event,data,function) // event 和 function 必须指出下面些段代码做说明: 例1:删除p的所有事件 $("p").unbind(); 例2:删除p的click事件 $("p").unbind("click"); 例2:删除p元素click事件后出发的test函数 和 添加p元素click事件后触发的test函数 $("p").unbind("click",test);$("p").bind("click",test); 注意:要定义 .bind() 必须指明什么事件和函数现在来看个简单的demo ,整个div有一个点击收起展开的事件,如果想要点击链接但是不触发div的点击事件,需要在触发链接的时候把div的点击事件禁用,这里我用到链接mouseenter事件是unbind删除div的事件。这里还不算完,这时候只要鼠标进入链接区域,div的点击事件就删除了,我们还需要加入鼠标移出链接区域的时候恢复div点击事件。代码如下: 12345678910$(function(){ var Func = function(){ $(".com2").toggle(200); } $(".test").click(Func) $(".test a").mouseenter(function(){ $(".test").unbind(); //删除.test的所有事件 }); $(".test a").mouseleave(function(){ $(".test").bind("click",Func); //添加click事件 }); });event 是事件类型 … function 是用来绑定的处理函数。 部分内容来自http://www.dearoom.com/blog/详解unbind和bind/http://www.dearoom.com/blog/事件捕获事件冒泡和阻止事件冒泡/
一个会写诗的程序员
2018/08/17
1.1K0

相似问题

Jquery:延迟OnChange函数

10

jquery onchange函数没有调用

34

Jquery onChange运行此函数

43

简单的jQuery函数onchange

30

jQuery onChange函数影响所有滑块

40
添加站长 进交流群

领取专属 10元无门槛券

AI混元助手 在线答疑

扫码加入开发者社群
关注 腾讯云开发者公众号

洞察 腾讯核心技术

剖析业界实践案例

扫码关注腾讯云开发者公众号
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档
查看详情【社区公告】 技术创作特训营有奖征文