通过js创建文本框

时间:2012-05-03 05:25:52

标签: php javascript

我的代码正在工作,我的文本从文本框到下一页+我的输入控件通过js到下一页但突然间似乎有一个错误在下面的代码中有错误

<html>
<head>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.7.2.js"></script>
<script type="text/javascript">
var i=2;
function AddTextbox(){
container.innerHTML=container.innerHTML+'<input type="text" name="'+ i + '">';
i++;
}
</script>

</head>
<body>
<form action="next.php" method="post">
<input type="text" name="1" />
<input type="button" onClick="AddTextbox" name="btn" value="add" />
<input type="submit" name="submit" value="sub" />
<div id="container"></div>
</form>
</body>
</html> 

2 个答案:

答案 0 :(得分:0)

<html>
<head>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.7.2.js"></script>
<script type="text/javascript">
var i=2;
$(document).ready(function() {
  $('#button').click(function(){
      $('#container').append('<input type="text" name="'+ i + '"><br/>')
      i++;
  });
});
</script>

</head>
<body>
<form action="next.php" method="post">
<input type="text" name="1" />
<input type="button" id="button" name="btn" value="add" />
<input type="submit" name="submit" value="sub" />
<div id="container"></div>
</form>
</body>
</html> 

使用点击功能。这是你需要的吗?

答案 1 :(得分:0)

<html>
  <head>
    <script>
      function addElement(tag_type, target, parameters) {
        //Create element
        var newElement = document.createElement(tag_type);

        //Add parameters
        if (typeof parameters != 'undefined') {
          for (parameter_name in parameters) {
            newElement.setAttribute(parameter_name, parameters[parameter_name]);
          }
        }

        //Append element to target
        document.getElementById(target).appendChild(newElement);
      }
    </script>
  </head>
  <body>
    <div id="targetTag"></div>
    <input type="button" onClick="addElement('INPUT','targetTag',{id:'my_input_tag', name:'my_input_tag', type:'text', size:'5'}); return false;" value="Add Input Tag" />
    <input type="button" onClick="addElement('INPUT','targetTag'); return false;" value="Add Input Tag W/O Parameters" />
  </body>
</html>

注意如果您在IE中执行此操作后懒得检查DOM,您将看到名称字段不可用。 IE将此字段声明为只读,这就是您没有看到它的原因。但是,该字段将被正确提交,如此测试代码所示:

<?php
if (isset($_POST)) {
  print '<pre>'.print_r($_POST,true).'</pre>';
}
?>
<html>
  <head>
    <script>
      function addElement(tag_type, target, parameters) {
        //Create element
        var newElement = document.createElement(tag_type);

        //Add parameters
        if (typeof parameters != 'undefined') {
          for (parameter_name in parameters) {
            newElement.setAttribute(parameter_name, parameters[parameter_name]);
          }
        }

        //Append element to target
        document.getElementById(target).appendChild(newElement);
      }
    </script>
  </head>
  <body>
    <form method="post">
    <div id="targetTag"></div>
    <input type="submit" value="Check"/>
    </form>
    <input type="button" onClick="addElement('INPUT','targetTag',{'id':'my_input_tag', 'name':'my_input_tag', 'type':'text', 'size':'5'}); return false;" value="Add Input Tag" />
    <input type="button" onClick="addElement('INPUT','targetTag'); return false;" value="Add Input Tag W/O Parameters" />
  </body>
</html>