0

我这里有两个表格，第一个是一个选择下拉选择，它在发布时会生成另一个表格，根据所选数字创建一个金额输入框。然后，第二种形式将输入框中的数据放入 2 个数组中。所有这一切都完美无缺，但我正在尝试向第二个表单上的提交按钮添加额外的功能。我创建了一个函数“showcontet()”来显示和隐藏 id 为“table”的 div 中的内容。当在表单外的按钮上使用时，这非常有效。在表单内的提交按钮上使用时，您可以看到内容大约 1 秒钟，然后再次消失。

    <head>
      <script type="text/javascript">
           showcontent = function(){
              var content = document.getElementById('tabl');
              content.style.display = 'inline';
           }

      </script>
        <?php 
    $userkey = array();
    $userval = array();
    $usernum = $_POST['usernum'];
    $total = 0;
    ?>


        <form action='MYPIE.PHP' method='POST'>
                HOW MANY SECTIONS?
                    <select name="usernum" value="<?php echo $usernum;?>">
                          <option>1</option>
                          <option>2</option>
                          <option>3</option>
                          <option>4</option>
                          <option>5</option>
                          <option>6</option>
                          <option>7</option>
                          <option>8</option>
                          <option>9</option>
                    </select>
                <input type="submit" name="submitnum" value="submit selection" />
        </form>


    <form action='MYPIE.PHP' method='POST'>     
        <?php 
            for ($i=1; $i<$usernum+1; $i++){
                echo '<input type="hidden" value="' .$usernum.'" name="usernum" />';
                echo "<br>insert key:   <input name='key".$i."' value='".$userkey[$i]."'>   insert value:   <input name='val".$i."' >";

            $userkey[$i] = $_POST["key".$i];
            $userval[$i] = $_POST["val".$i];
            }

        ?>
        </br>
        <input type="submit" value="submit" name="submit keys" onclick="showcontent()" />
    </form>

    </table>


    <div id="tabl" style="display:none;">
    content
    </div>

抱歉缩进不好，我对此很陌生，感谢您的帮助

4

3 回答 3

2

您需要return false从事件处理程序中阻止浏览器提交表单并加载页面。

于 2012-07-06T12:26:34.593 回答
0

使您的第二个按钮不是“提交”按钮，而是常规“按钮”，否则它将触发表单的提交...

或者

在表单 'onsubmit' 事件上设置 'showcontent()' 函数并让该函数返回 false：

onsubmit="return showcontent()"

function showcontent(){
    var content = document.getElementById('tabl');
    content.style.display = 'inline';

    $.ajax({
        type: "POST",
        url: "MYPIE.PHP",
        data: { usernum: $("select[name='usernum'] option:selected").val() }
        }).done(function() {
            alert('data posted');
    });

    return false;
}
于 2012-07-06T12:27:57.360 回答
0

您需要添加 e.preventDefault(); 到事件处理程序以防止浏览器提交表单和加载页面。

不要使用 return false ，因为这是您可能不想要的其他副作用。见http://fuelyourcoding.com/jquery-events-stop-misusing-return-false/

于 2012-07-06T12:31:39.737 回答