zoukankan      html  css  js  c++  java
  • 动态添加html示例

      <table id="voteitem">
                    <tr>
                        <td>选项1:</td>
                        <td>
                              <input name="VoteOptions" class="required" type="text"  alt="请输入投票选项" value="@ViewBag.VoteOptions"/>
                        </td>
                    </tr>
                </table> 

    <script type="text/javascript" language="javascript">
            function add_input_file(tbfile, index) {
                file_name = "VoteOptions" + index;
                var tr_file = document.createElement("tr");
                var td_file = document.createElement("td");
                var td_file1 = document.createElement("td");
                td_file1.setAttribute
                var text = document.createElement("span");
                text.setAttribute("innerText", "选项" + index);
                td_file1.appendChild(text);

                var input_file = document.createElement("input")
                input_file.setAttribute("type", "text")
                input_file.setAttribute("class","required");
                input_file.setAttribute("name", file_name)

                td_file.appendChild(input_file)

                tr_file.appendChild(td_file1);
                tr_file.appendChild(td_file)
                tbfile.appendChild(tr_file)
            }
            function add_one_file() {
                var tb_file = document.getElementById("upload_file");
                var count_file = document.getElementById("upload_file").childNodes.length;

                add_input_file(tb_file, count_file);
            }


            var i = 1;
            function AddItem() {
                i++;
                if (i > 15) {
                    alert("最大只允许15个选项!");
                    return;
                }
                var htmldata = "<tr><td>选项" + i + ":</td><td> <input class='required' name='VoteOptions" + i + "' type='text' ></td></tr>";
                jQuery("#voteitem").append(htmldata);
            }
            function ResetItem() {
                i = 1;
                var obj = document.getElementById("voteitem");
                obj.innerHTML = "<tr><td>选项1:</td><td> <input class='required'  type='text'></td></tr>";
            }

        </script>

  • 相关阅读:
    css3中的位置移动
    css中伪元素选择器
    css中伪类选择器
    html5之属性选择器
    html5的文本属性
    html5的视频和音频使用
    常用的linux命令
    常见的http状态码
    springboot之安装和启动es
    linux版本的jdk安装
  • 原文地址:https://www.cnblogs.com/weidehao555/p/3262587.html
Copyright © 2011-2022 走看看