使用JS生成HTML标签,以达到母板页的效果
前台页面
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="WebApplication1.WebForm1" %> <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title></title>
<script src="js/jquery-1.9.1.min.js"></script>
<style>
.cls {
margin-left: 5px;
border: 1px;
}
</style>
</head> <body>
<form id="form1" runat="server">
<div id="div1">
</div>
<div id="div2"></div>
</form>
<script src="js/global.js"></script>
<script src="js/webForm1.js"></script>
</body>
</html>
webForm1.aspx
$(function () {
var div = document.getElementById('div1');
div.innerHTML = '<label class="cls">标题1</label><label class="cls">标题2</label><label class="cls">标题3</label>'
});
母板页的脚本
$(function () {
$("label").click(function () {
alert("你好,标题!");
});
});
webForm1页面的脚本
使用JS生成HTML标签,以达到母板页的效果的更多相关文章
- 原生js怎么为动态生成的标签添加各种事件
这几天用zepto.js写了不少事件,突然想到一个问题,那就是原生的js如何给动态生成的标签添加事件?因为这些标签都是后来通过ajax或者运行其他点击事件生成的,那么如果之前给他们写事件他们这个dom ...
- 前端学习-使用JS库Leaflet.js生成世界地图并获取标注地址经纬度。
介绍:Leaflet是一个开源的JavaScript库,对移动端友好且对地图有很好的交互性. 大小仅仅只有 33 KB, 同时具有大多数地图所需要的特点. Leaflet设计的非常简单易懂, 同时具有 ...
- JS手动创建标签
代码: <html> <head> <title>js标签属性的添加</title> <script > function setxxx() ...
- js生成带logo的二维码
作为一名java程序员,一直以来都是使用服务端生成二维码,最近接触前端的设计,感觉二维码这块如果放到前端去生成,一方面可以减轻服务端的压力,访问带宽,另一方面,前端页面控制比较顺畅 闲话少叙,说下我的 ...
- js生成条形码插件
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- js生成二维码以及点击下载二维码
js生成二维码 jquery.qrcode.js可以快速使用页面生成二维码.但改项目有两个小问题:1.不支持中文:2.不支持二维码中间生成图片. 支持中文的jquery-qrcode jquery.q ...
- jq给动态生成的标签绑定事件的几种方法
经常遇到给动态生成的标签绑定事件不好用,自己简单测试总结了下,结论如下了: body> <!-- 下面是用纯动态方式生成标签 --> <div id="d2" ...
- js生成pdf报表
由于前台html已经动态生成报表,而且,前台有一个功能,一个date range组件,当你拖动的时候,报表会在不提交到后台的情况下动态变化.因此需要用到js生成生报表: 用到的组件: jquery.j ...
- 使用two.js生成的卫星环绕动画效果
来源:GBin1.com two.js是一个帮助你实现绘图和动画效果的类库,同时支持三种前端绘图实现: webgl svg 2d画布 使用这个类库,可以方便的支持这三种不同的实现,你只需要设置参数:T ...
随机推荐
- 关于redis的几件小事(十)redis cluster模式
redis cluster是redis提供的集群模式. 1.redis cluster的架构 ①可以有多个master node,每个master node 都可以挂载多个slave node. ②读 ...
- 13 UA池和代理池
一. 下载中间件 框架图 下载中间件(Downloader Middlewares) 位于scrapy引擎和下载器之间的一层组件. - 作用: (1)引擎将请求传递给下载器过程中, 下载中间件可以对请 ...
- WPF中关于合并资源字典
一.本项目中 <ResourceDictionary> <ResourceDictionary.MergedDictionaries> <!--<ResourceD ...
- java实现RPC
一,服务提供者 工程为battercake-provider,项目结构图如下图所示 1.1 先创建一个“卖煎饼”微服务的接口和实现类 package com.jp.service; public in ...
- MySQL配置文件my.cnf中文详解
#BEGIN CONFIG INFO #DESCR: 4GB RAM, 只使用InnoDB, ACID, 少量的连接, 队列负载大 #TYPE: SYSTEM #END CONFIG INFO # # ...
- 为Qtcreator 编译的程序添加管理员权限
(1)创建资源文件 myapp.rc 1 24 uac.manifest (2)创建文件uac.manifest <?xml version="1.0" encoding=& ...
- ubuntu搭建gerrit+gitweb代码审核系统
一.Gerrit的简介 Gerrit是Google开源的一套基于web的代码review工具,它是基于git的版本管理系统.Google开源Gerrit旨在提供一个轻量级框架,用于在代码入库之前对每个 ...
- 自动化运维——MySQL备份脚本(二)
使用if语句编写MySQL备份脚本 代码: #!/bin/bash #auro backup mysql db #by steve yu #define backup path BAK_DIR=/da ...
- 并查集+启发式合并+LCA思想 || 冷战 || BZOJ 4668
题面:bzoj炸了,以后再补发 题解: 并查集,然后对于每个点记录它与父亲节点联通的时刻 tim ,答案显然是 u 到 v 的路径上最大的 tim 值.启发式合并,把 size 小的子树往大的上并,可 ...
- 关于session失效的问题(内网IP与外网IP)
参考: 测试环境测试支付宝支付,以ip方式访问,而支付宝支付成功后回调地址配置的是域名形式的.造成支付成功后访问成功页面进入了登录页面 同一个网站,通过域名登录和通过IP登录,所产生的session是 ...