js批量绑定id为 click事件demo

最新推荐文章于 2023-12-28 10:21:00 发布

原创最新推荐文章于 2023-12-28 10:21:00 发布 · 2.8k 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#js

javascript 专栏收录该内容

24 篇文章

订阅专栏

本文介绍了一个简单的JSP页面如何通过JavaScript与jQuery库进行交互的例子。该示例展示了如何利用jQuery处理按钮点击事件并弹出警告框，同时介绍了获取当前项目的基路径的方法。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

<%@ page language="java" contentType="text/html; charset=utf-8"
    pageEncoding="utf-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<script language="javascript" src="<%=basePath %>js/jquery.min.js"></script>
<script language="javascript" src="<%=basePath %>js/MyQiniu.js"></script>
<title>Insert title here</title>
</head>
<body>
	<input id="11" type="button"/>
	<input id="22" type="button"/>
	<input id="33" type="button"/>
	<input id="44" type="button"/>
	<input id="55" type="button"/>
	<input id="66" type="button"/>
	<script type="text/javascript">
	uu("#11");
	uu("#22");
	uu("#33");
	uu("#44");
	uu("#55");
	</script>
</body>
</html>

MyQiniu.js

	function uu(man){
		$(man).click(function(){
			  alert(man)
			});
	}

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

编码的三叔

关注关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
分享

复制链接

分享到 QQ

分享到新浪微博

扫一扫
举报

举报

专栏目录

SortTable.js + vxe-table 实现多条批量排序

小先生编程

06-12

1287

环境: 功能: 实现表格拖动排序，支持单条排序，多条排序实现思路: 官网只有单条排序的例子，网上也都是简单的使用，想要实现多条排序，就要结合着表格的复选框功能，在对其勾选的行统一计算！最终效果: 实现代码

Vue SSM搭建一个简单的Demo前后端分离含增删改查(CRUD)、分页、批量功能

年轻的心跳

08-10

8553

Vue SSM搭建一个简单的Demo前后端分离含增删改查(CRUD)、分页、批量功能前言最近想复习一下SSM，所以就搭建了这个小DEMO，轻车熟路，个人认为在只用到SSM框架的前提下，这样做是最简洁的搭建方式了。写这篇博客也是复习的一部分，也想收获些意料之外的XXXX。用到的技术和开发工具前端开发工具：WebStorm 开发框架：vue + axios + elementUI 包管理工具: npm 打包工具：webpack 后端开发工具：IDEA 开发框架：springMVC + spri

参与评论您还未登录，请先登录后发表或查看评论

JS批量绑定事件

aaronthon的博客

08-21

500

var a = [1,2,3,4,5] for(var j in a){ $("#" + j).click(function () { // 前提是先动态生成id是j的标签 var id_cm = $(this).attr("id"); // 注意参数要获取当前点击标签的id，不要传j，因为当点击标签时j始终是5（就是最后一个值），可以自己去验证...

js调用点击事件

东方雎的专栏

06-08

9364

只是简单地调用了btnObj的onclick所指向的方法，只是调用方法而已，并未触发事件, 一、 $("#id").onclick(); // 真正地用程序去点击按钮，触发了onclick（）事件, // 注意：隐藏之后就不行了,设定隐藏不要使用Visiable属性，使用style.display=none 二、 $("#id").click(); // 只是调用了onclic

java js id的点击事件_JavaScript中点击事件的写法

weixin_42520573的博客

02-27

2980

clickvar btn=document.getElementById('btn');第一种：btn.onclick=function(){alert('hello world');}消除事件：btn.onclick=null;//就不会弹出框了第二种：btn.addEventListener('click',function(){alert('hello world')},false);btn...

js循环添加标签并利用其id绑定点击事件

Be Like

07-29

1748

function removeAdImage(id){ console.log(id) console.log(document.getElementById(id)) var imgDiv = document.getElementById(id); imgDiv.parentNode.removeChild(imgDiv); } $('#imagess').o...

JS控件监听

CaiJin6a的博客

12-28

703

通过监听控件，进行一些对应的函数调用

【Layui表格事件监听：提升效率的10个技巧】：立即掌握表格行选择与事件绑定的秘诀

![【Layui表格事件监听：提升效率的10个技巧】：立即掌握表格行选择与事件绑定的秘诀]...特别针对事件绑定、监听技巧和进阶功能开

js表格操作，DOM实现数据动态增删查改

12-02

- 在表格容器元素上添加一个事件监听器，如`addEventListener('click')`，通过`event.target`判断哪个元素被点击，从而执行相应的操作。 8. **优化性能** - 使用`innerHTML`批量更新表格，而不是逐个单元格修改，...

jquery批量上传图片

02-27

在IT行业中，jQuery库是广泛使用的JavaScript库，它极大地简化了DOM操作、事件处理和Ajax交互。本篇文章将深入探讨如何使用jQuery实现批量上传图片的功能，这是一个常见的需求，特别是在社交媒体平台、电商网站和...

怎么看自己qq被关联.docx

09-27

怎么看自己qq被关联.docx

jquery 根据id动态分配change,click事件等

Wx_H_的博客

11-03

5547

因工作的需要~现在要将页面的提示信息内容采用动态分配的方法(虽然不知道哪里好.感觉如果ID多的话会很卡) 但是还是完成了这个恶心的要求.. 1 321 12321321 首先先做了个demo 界面是很简单的几个input,button等框框然后写好一个js.内容为change等事件会触发的function fun

html 点击同意,一个id 绑定click事件做不同的条件判断？

weixin_35932973的博客

06-23

486

js代码://弹窗注册协议ms=window.parent.document.getElementById('inputzz1');ks=window.parent.document.getElementById('inputzz');$('#yes-agree').click(function(){console.log(ms);if(!(ms.getAttribute('checked')))...

javascript中的点击事件click的写法

清颖的博客

03-28

4006

javascript中click方法： 1.通过id获取到元素 click 通过id获取到元素 var btn=document.getElementById(“btn1”); btn.function(){ … } 2. “fun();” click （1）写在初始化函数内： window.function(){ 方法名fun=function(){ … } } (2)写在初始化函数外部 fun...

Javascript中点击（click）事件的3种写法

最新发布

07-26

在jQuery中，我们可以使用`.css()`函数来批量修改HTML元素的样式。这个函数接收两个参数：第一个参数可以是一个键值对的对象，也可以是CSS选择器；第二个参数则是对应的值。 ### 使用实例 #### 示例1: 修改单个元素的样式假设你有这样一个HTML元素，并希望更改它的字体颜色为红色： ```html <div id="demo">Hello World!</div> ``` 你可以通过jQuery将其样式修改为红色： ```javascript $(document).ready(function() { $("#demo").css("color", "red"); }); ``` ### 示例2: 修改多个元素的样式如果你想同时改变一组元素的样式，例如所有`<p>`标签的背景色为蓝色： ```html <p>Paragraph 1</p> <p>Paragraph 2</p> <p>Paragraph 3</p> ``` 可以通过jQuery轻松实现： ```javascript $(document).ready(function() { $("p").css("background-color", "blue"); }); ``` ### 示例3: 使用CSS选择器批量修改样式如果你想要使用CSS选择器来定位元素并修改其样式，可以这样做： ```javascript $(document).ready(function() { $("p[id^='para']").css("font-size", "larger"); }); ``` 这里使用了选择器`[id^='para']`，它会选择ID以“para”开头的所有元素，并修改它们的字体大小为更大。 ### 示例4: 修改动态添加的元素样式假设在页面加载之后，通过JavaScript动态创建了一个元素： ```html <button id="addParaBtn">Add Paragraph</button> <div id="content"></div> ``` 并且添加了一个点击事件处理器，用于动态添加新的段落元素： ```javascript $(document).ready(function() { $("#addParaBtn").click(function() { $("<p>").text("New paragraph").appendTo("#content"); }); }); $("#content").on("click", "p", function() { $(this).css("color", "green"); }); ``` 这里，每当用户点击添加按钮就会生成一个新的段落，然后我们绑定一个事件处理器到这些段落上，使得每次点击都会将文本颜色改为绿色。 ### 结论通过使用jQuery的`.css()`方法，你可以高效且方便地批量修改HTML元素的样式，无论是单个元素还是整个DOM树的部分内容。这种方法尤其适合于脚本驱动的动态网页应用，其中样式需求经常变化。