开发者社区

文档建议反馈控制台

文章/答案/技术大牛

发布

社区首页 >问答首页 >JQUERY未处理(onchange)函数

问JQUERY未处理(onchange)函数
EN

Stack Overflow用户

提问于 2021-04-03 18:06:20

回答 2查看 28关注 0票数 0

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

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

<?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变量之前打印消息

<?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(函数为：

$("#all_category").on('change',function

或者试试这个：

$(document).on('change','#all_category',function(){

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

票数 0

EN

Stack Overflow用户

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

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

<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

复制

相关文章

javascript html 编程算法

定义和用法 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

swift ios tcp/ip 编程算法渲染

从 iOS 14 开始，SwiftUI 为视图提供了 onChange 修饰器，通过使用 onChange，我们可以在视图中对特定的值进行观察，并在其更改时触发操作。本文将对 onChange 的特点、用法、注意事项以及替代方案做以介绍。

东坡肘子

2022/07/28

2.9K0

jQuery遍历函数

jquery java https 网络安全

.closest()：从元素本身開始，逐级向上级元素匹配。并返回最先匹配的祖先元素。

全栈程序员站长

2022/07/07

1.1K0

jquery定时执行函数_jquery自动提交

https java 网络安全

版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容，请发送邮件至举报，一经查实，本站将立刻删除。

全栈程序员站长

2022/10/01

2.3K0

用户代码未处理MetadataException

https java 网络安全 sql 数据库

最近在用EF搭框架的过程中，遇到了很多问题，大部分都是出现在配置文件中，比如说下面这个问题：

全栈程序员站长

2022/08/09

3120

用户代码未处理MetadataException

jQuery学习---入口函数

jquery javascript

· 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原理（入口函数）

jquery 编程算法

var likeArr = { 0: "lnj", 1: "33", 2: "male", length: 3 };

Dreamy.TZK

2020/06/23

5.2K0

JQuery 绑定select标签的onchange事件，弹出选择的值，并实现跳转、传参

jquery javascript

参考文献 http://www.cnblogs.com/moli-/p/6406170.html

山河木马

2019/03/05

1.4K0

Jquery源码分析：初始化Jquery函数

编程算法 jquery

今天我们来分析一下jquery的源码，从关于初始化jquery这个函数开始。版本：3.4.1

小明爱学习

2020/01/21

1.1K0

Jquery源码分析：初始化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和入口函数)

javascript npm https cdn 网络安全

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混元助手 在线答疑

关注 腾讯云开发者公众号

洞察 腾讯核心技术

剖析业界实践案例