编程 Javascript

在一个页面重复使用一个js函数的方法详解

Posted in Javascript onDecember 26, 2016

1、给每个拥有相同行为的问题DOM节点一个相同的class类，如question，同时给不同的问题一个不同的标识ID如 id="question1" id="question2"...诸如此。

2、给类.question绑定点击事件，在触发函数里面先判断当前点击的这个类的id，即可知道你要操作的是哪一个问题，然后调用你的那个伸缩函数即可。

<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title>jQuery加法器</title>
<script src="js/jquery-1.4.4.min.js" type="text/javascript" charset="utf-8"></script>
<style>
div {
width: 250px;
height: 250px ;
background-color: #337ab7;
float:left;
margin: 10px;
}
</style>
</head>
<script>
$(function(){
$(".question").click(function(){
//获取问题ID
var id = $(this).attr("id");
//console.log(id)
//...执行你的函数代码
})
})
</script>
<body>
<div class="question" id="question1"></div>
<div class="question" id="question2"></div>
<div class="question" id="question3"></div>
<div class="question" id="question4"></div>
</body>
</html>

以上就是小编为大家带来的在一个页面重复使用一个js函数的方法详解全部内容了，希望大家多多支持三水点靠木~

在一个页面重复使用一个js函数的方法详解

- Author -

jingxian

声明：登载此文出于传递更多信息之目的，并不意味着赞同其观点或证实其描述。

Javascript 相关文章推荐

JavaScript 以对象为索引的关联数组

May 19 Javascript

js URL参数的拼接方法比较

Feb 15 Javascript

JavaScript基础篇之变量作用域、传值、传址的简单介绍与实例

Jun 29 Javascript

js加减乘除丢失精度问题解决方法

May 16 Javascript

js遍历子节点子元素附属性及方法

Aug 19 Javascript

基于javascript实现动态显示当前系统时间

Jan 28 Javascript

AngularJs Using $location详解及示例代码

Sep 02 Javascript

JS实现图片上传多次上传同一张不生效的处理方法

Aug 06 Javascript

layui的table单击行勾选checkbox功能方法

Aug 14 Javascript

layer关闭当前窗口页面以及确认取消按钮的方法

Sep 09 Javascript

JS sort方法基于数组对象属性值排序

Jul 10 Javascript

JS + HTML 罗盘式时钟的实现

May 21 Javascript

jquery无法为动态生成的元素添加点击事件的解决方法(推荐)

Dec 26 #Javascript

jQuery实现动态添加tr到table的方法

Dec 26 #Javascript

浅谈JavaScript的计时器对象

Dec 26 #Javascript

js模糊查询实例分享

Dec 26 #Javascript

AngularJs篇：使用AngularJs打造一个简易权限系统的实现代码

Dec 26 #Javascript

jQuery实现可移动选项的左右下拉列表示例

Dec 26 #Javascript

关于javascript事件响应的基础语法总结(必看篇)

Dec 26 #Javascript