Question

我想使用JSON将表单添加到reveal.js演示文稿中。

以下是其中一张揭示幻灯片中嵌入的表格：

<section>
  <form action="#">
    First name: <input type="text" name="firstname"><br>
    Last name: <input type="text" name="lastname">
 <button type="submit">Submit</button>
</section>

我还将此PHP脚本添加到文件的顶部：

<?php 
if(isset($_POST['submit'])){
    $file = "data.json";
    json_string = json_encode($_POST,JSON_PRETTY_PRINT);
    file_put_contents($file, $json_string,FILE_APPEND);
}
 ?>

我认为该文件应该以.php扩展名运行，以正确执行将用户输入发送到服务器的PHP脚本，但是，当将revealjs作为.php扩展名运行时，我得到一个白屏。

有没有人在他们的revealjs演示文稿中成功嵌入表单？

谢谢！

Answer 1

是的我将表单添加到reveal.js，但我使用的是javascript，没有php。

您可以在此处试用：http://jsfiddle.net/B9r22/20/

<h2>Form</h2>
<section>
  <form action="#">
      First name: <input type="text" name="firstname" data-name="firstname"/><br/>
      Last name: <input type="text" name="lastname" data-name="lastname"/><br/>
      <button type="submit">Submit</button>
</section>
<h2>JSON</h2>
<p id="json"></p>

    $(function() {
        $('body').on('submit','form',function() {
            var answers = [];
            $('input[type="text"]', this).each(function(){
            answers.push({'name':$(this).data('name'), 'value':this.value});
            });
            var data = {
                'answers': answers
            };
            json = JSON.stringify(data);
            $('#json').append(json);
            return false;
        });    
    });

添加表单以显示.js演示文稿

1 个答案: