javascript - 附加元素在被传递时变得未定义

Question

嗨，我有这段代码，everclick 附加了一个 DOM 元素，用户可以在其中选择他想要的内容，然后将其提交到另一个页面。

<form action="view.php" method="post">
<textarea name="paragraph[]"></textarea><input type="button" onclick="addparagraph();" value="+">
</input>
<select name="font[]">
<option>Tohoma</option>
<option>Arial</option>
</select>
<div id="firstpart"></div>
<input type="submit" value="submit"/>
</form>
<script>
function addparagraph(){
  var string = '<textarea name="paragraph[]"></textarea>'+
  '<select name="font[]"><option>Tohoma</option><option>Arial</option></select>';
  jQuery('#firstpart').append(string);
}
</script>

一旦提交，它就不会获取附加元素的值

这是view.php部分

foreach($_POST['paragraph'] as $count => $value){
  echo "$value";
  echo "$_POST['font'][$count];
}

它附加了元素，但不显示附加数组的值..它给出了错误偏移量未定义

Answer 1

1.您需要添加 jQuery 库才能使您的代码正常工作。

2.您还需要更改PHP代码。

代码需要如下所示:-

HTML 页面:-

<form action="view.php" method="post">
    <textarea name="paragraph[]"></textarea><input type="button" onclick="addparagraph();" value="+"></input>
    <select name="font[]">
        <option>Tohoma</option>
        <option>Arial</option>
    </select>
    <div id="firstpart"></div>
    <input type="submit" value="submit"/>
</form>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script>
function addparagraph(){
  var string = '<textarea name="paragraph[]"></textarea>'+'<select name="font[]"><option>Tohoma</option><option>Arial</option></select>';
  jQuery('#firstpart').append(string);
}
</script>

PHP 页面:-

<?php
foreach($_POST['paragraph'] as $key => $value){
  echo $value;
  echo "<br>";
  echo $_POST['font'][$key];
}