使用JS生成HTML标签，以达到母板页的效果

最新推荐文章于 2023-04-15 23:40:51 发布

weixin_33806914

最新推荐文章于 2023-04-15 23:40:51 发布

阅读量101

点赞数

CC 4.0 BY-SA版权

文章标签： c# xhtml

原文链接：http://www.cnblogs.com/vichin/p/8672949.html

本文介绍了一个使用ASP.NET WebForm结合jQuery实现页面元素动态加载的例子。通过JavaScript在页面加载时向指定的div元素中添加带有特定样式的标签，并为这些标签绑定了点击事件。

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

前台页面

<%@ 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页面的脚本

转载于:https://www.cnblogs.com/vichin/p/8672949.html