Jquery/js引入的button的onclik事件只触发一次

时间:2021-07-10 01:19:46
  • 目标描述

我要实现的是:通过监听button的click事件,从而通过ajax向servlet发送请求获取数据库中的数据,然后返回的页面,并要求局部刷新

一次页面的加载是html直接页面初始化本身的

点击之后所在板块是通过js重新覆盖的

  • 问题描述

第一点击的时候,成功加载,但第二次就无法触发

  • 修改之前的代码
$(function() {//初始化方法
$(".Goodshandle").on("click",function() {
var goodsid=$(this).val();
console.log(goodsid);
var frushId="handle";
$.ajax({
//对应servelt路径
url : "Goods_UpOrDown",
//传到服务端的数据
data : {"goodsid":goodsid},
//请求方式
type : "post",
//传输数据的格式
dataType : "json",
//请求成功后执行的方法
success : function(data) {
console.log(data);
//这里的代码是通过Jquery的html();方法对指定板块的html代码重写覆盖,从而实现局部更新,具体代码略去 }
}); }) })
  • 问题分析

原因是通过on来绑定click事件如上述代码,只会监听一次,之后就会丢失

  • 处理方法

将绑定方式更改为

$(document).off("click",".Goodshandle").on("click",".Goodshandle", function() {
  //此处代码和上述一样
}

Jquery/js引入的button的onclik事件只触发一次的更多相关文章

  1. jQuery.js引入时要在其他js文件之前,否则js中无法识别jQuery的语法

  2. jquery 关于使用 append 追加 元素后 事件无法触发

    当在使用js或jQuery创建元素时,用 on(事件,function(){代码}) 或者 事件(function(){代码 })绑定事件时 在使用append添加元素后 由于是在页面加载完成之后进行 ...

  3. jquery hover事件只触发一次动画

    最近工作时遇到个关于动画的问题,如下: $("div").hover( function() { $(this).animate({"margin-top":& ...

  4. 【转】【WPF】WPF中的Button的MouseDown事件不触发问题

    按照WPF的帮助说明,某些控件的路由事件被内部处理了,已经被标记为Handled,自行定义的事件处理代码便不再起作用了,有时候会很郁闷! 不过WPF提供了必要的方法. 1)使用相应的Preview事件 ...

  5. js -- 绑定的click addEventListener 事件只触发一次

    var btn = document.getElementById('btn'); // 添加事件绑定 btn.addEventListener('click', btnClick, false); ...

  6. 通过js添加的元素点击事件无法触发

    var blk_have ='<div class="sw-off"></div>'; $('#blk').prepend(blk_have); $(doc ...

  7. 使用input file上传文件中onChange事件只触发一次问题

    每次上传文件的时候,都会将当前的文件路径保存至$event.target.value中,当第二次选择文件时,由于两次$event.target.value相同,所以不会触发change事件. 解决方案 ...

  8. jquery,js引入css文件,js引入头尾

    jquery,js引入css文件,js引入头尾 今天在项目中,需要把20多个页面加上头和尾部,头和尾是我写的,所以小师傅把这个工作交给我了. 我开始往里面加,先引入common.css,在body开始 ...

  9. 使用JS或jQuery模拟鼠标点击a标签事件代码

    原文 使用JS或jQuery模拟鼠标点击a标签事件代码 这篇文章主要介绍了使用JS或jQuery模拟鼠标点击a标签事件代码,需要的朋友可以参考下 <a id="alink" ...

随机推荐

  1. SCNU ACM 2016新生赛决赛 解题报告

    新生初赛题目.解题思路.参考代码一览 A. 拒绝虐狗 Problem Description CZJ 去排队打饭的时候看到前面有几对情侣秀恩爱,作为单身狗的 CZJ 表示很难受. 现在给出一个字符串代 ...

  2. CSS Devices可以让你在线直接获取使用CSS写的Mobile外形。

    CSS Devices可以让你在线直接获取使用CSS写的Mobile外形. CSS Devices 彩蛋爆料直击现场

  3. B桥接模式ridge

    1.一个简短的引论 1)模式概述:将抽象部分与实现部分分离.使它们都能够独立的变化.让抽象类和派生类各自实现自己的对象.当一个系统有多维度的变化时,将各个维度分离出来让它们独立于变化(多角度地分类实现 ...

  4. 201521123103 《java学习笔记》 第十周学习总结

    一.本周学习总结 1.1 以你喜欢的方式(思维导图或其他)归纳总结异常与多线程相关内容. 二.书面作业 本次PTA作业题集异常.多线程 1.finally 题目4-2 1.1 截图你的提交结果(出现学 ...

  5. vue2&period;0 实现导航守卫(路由守卫)

    路由跳转前做一些验证,比如登录验证,是网站中的普遍需求. 对此,vue-route 提供的 beforeRouteUpdate 可以方便地实现导航守卫(navigation-guards). 导航守卫 ...

  6. java 中的引用数据类型

    字符串String 在java 中,字符串不是基本数据类型,而是String 类的对象,当我们创建一个字符串的时候,真的是要使用new 来调用String 构造函数 String str = new ...

  7. 安卓TabLayout&plus;ViewPager实现切页

    安卓使用TabLayout+ViewPager+Fragment 实现页面切换,可实现左右滑动切换视图界面和点击切换 可自定义菜单栏是在顶部还是在底部 一.实现效果: 二.实现过程: 2.1 一些重要 ...

  8. sqlserver truncate清空表时候,无法删除 &&num;39&semi;B表&&num;39&semi;,因为该表正由一个 FOREIGN KEY 约束引用。

    外键: 查询:select object_name(a.parent_object_id) 'tables'  from sys.foreign_keys a  where a.referenced_ ...

  9. springboot 整合 mongodb实现 批量更新数据

    现需求:需要批量将1000个数据先查询在更新到mongodb(如果查询不到数据,则添加数据) 1:工具类BathUpdateOptions import org.springframework.dat ...

  10. 认识CSS中css引入方式、选择器、文本样式设置以及显示模式

    前端之HTML.CSS(三) CSS CSS-Cascading Styles Sheets,层叠样式表.用于网页的表现,主要用于布局和修饰网页. CSS引入方式 CSS的三种引入方式:行内样式,内部 ...