Question

我很抱歉，如果这似乎是一个初学者的问题并且浪费了你的一些时间，但它确实让我感到困扰，如果有人可以提供帮助，我会非常感激。

我只是创建一个＆＃34;区域＆＃34;如果你愿意，用户输入一个单词/句子作为任务，然后可以检查任务是否完成和/或是否需要更改单词/句子。

所以最后，我需要的是一个文本框，让我们说出用户输入一个假定为x的特定数字，并生成x乘以这个div。

这是代码（遗憾的是，由于我没有足够的声誉，我无法发布图片。）

ASP.NET代码

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="GMode.tiz.WebForm1" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>whatevz</title>
    <link href="StyleSheet1.css" rel="stylesheet" />
    <script src="../jquery-1.11.3.min.js"></script>
    <script src="../functions.js"></script>


</head>
<body>
    <form id="form1" runat="server">

        <div class="singleContainer">
            <div class="lblPlace">
                <asp:Label ID="lbl" runat="server" Text="Input Task"></asp:Label>
                <asp:TextBox ID="hi" CssClass="txtBox" runat="server"></asp:TextBox>
            </div>
            <asp:Button ID="save" runat="server" CssClass="UniversalBtn" OnClick="btnCheck_Click" />
            <asp:Button ID="cancel" runat="server" CssClass="UniversalBtn" OnClick="btnCancel_Click" />
            <asp:Button ID="edit" runat="server" CssClass="UniversalBtn" />
            <asp:Button ID="submit" runat="server" CssClass="BtnSubmit" OnClick="btnSubmit_Click" Text="DONE"/>
        </div>


    </form>
</body>
</html>

C＃代码

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;

namespace GMode.tiz
{
    public partial class WebForm1 : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {

        }

        protected void btnCheck_Click(object sender, EventArgs e)
        {
            lbl.CssClass = "done";
        }

        protected void btnCancel_Click(object sender, EventArgs e)
        {
            lbl.CssClass = "undone";
        }

        protected void btnSubmit_Click(object sender, EventArgs e)
        {
            if (hi.Text == "")
            {
                lbl.Text = "No Value";
            }
            else
            {
                lbl.Text = hi.Text;
            }
        }

    }
}

所以基本上我想动态创建<div class="singleContainer">里面的所有内容x次（x由用户定义）。

我更多关于这个事实，就像它的C ++一样。当您可以动态创建具有特定数字x的数组时。

如果您需要更多代码，请告诉我。还有我没有发布的css和js文件。

谢谢你，千斤顶

Answer 1

我认为最好的选择是使用AngularJS，你可以这样做：

<html>
<head>
<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css" />
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.4/angular.min.js">    </script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.4/angular-resource.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.4/angular-route.min.js"></script>
<script>
var app = angular.module('app', [])
app.controller('PostsCtrl', function ($scope) {

$scope.change = function (){
$scope.listDivs = [];

    for(var i=0;i<$scope.createDiv;i++) {
      $scope.listDivs.push(i);
    }
}


})
</script>
</head>
   <body ng-app='app'>
   <div ng-controller='PostsCtrl' class='container'>
   <input ng-model='createDiv' ng-change="change()"/>
   <ul class='list-group'>
    <li ng-repeat="post in listDivs" class='list-group-item'>
      <div class="singleContainer">
        <div class="lblPlace">
            <asp:Label ID="lbl" runat="server" Text="Input Task">   </asp:Label>
            <asp:TextBox ID="hi" CssClass="txtBox" runat="server">   </asp:TextBox>
        </div>
        <asp:Button ID="save" runat="server" CssClass="UniversalBtn" OnClick="btnCheck_Click" />
        <asp:Button ID="cancel" runat="server" CssClass="UniversalBtn" OnClick="btnCancel_Click" />
        <asp:Button ID="edit" runat="server" CssClass="UniversalBtn" />
        <asp:Button ID="submit" runat="server" CssClass="BtnSubmit" OnClick="btnSubmit_Click" Text="DONE"/>
    </div>
   </li>
 </ul>
</div>
</body>
</html>

Answer 2

将div放入usercontrol（ascx文件）。

在您的主页面中添加占位符：

<asp:PlaceHolder runat="server" ID="PlaceHolder1" />

在后面的代码中，您可以根据需要随时添加控件：

yourControl= LoadControl("~/Controls/yourControl.ascx");
PlaceHolder1.Controls.Add(yourControl);

使用C＃中的子项动态创建特定div

2 个答案: