Question

我有2个按钮。

1 =创建字段
2 =创建（写入数据库）

如果按下“创建字段”按钮，我会在更长时间内获得此结构：

<div class="step">
  <div class="header_step">Schritt 1 des Tutorial's</div>
  <div class="body_step">
    <a class="create_tutorial_a">Titel des Schrittes</a>
    <input id="input_title_name0" class="create_tutorial_input">
    <br>
    <a class="create_tutorial_a">Bild</a>
    <input type="file">
    <br><br>
    <a class="create_tutorial_a_full_width">Beschreibung des Schrittes</a>
    <br>
    <textarea class="create_tutorial_textarea" id="input_description_name0">
    </textarea>
  </div>
</div>

当我再次按下按钮时，我将再次获得相同的效果。只是输入字段的名称会改变。我用Jquery做了这个。

在此之后我按下“创建”按钮。现在我想将字段的值写入我的数据库。我的表格看起来像这样：

<form method="post" action="index.php?content=create_tutorial" id="form1">
  
  <div class="step">
    <div class="header_step">Schritt 1 des Tutorial's</div>
    <div class="body_step">
      <a class="create_tutorial_a">Titel des Schrittes</a>
      <input id="input_title_name0" class="create_tutorial_input">
      <br>
      <a class="create_tutorial_a">Bild</a>
      <input type="file">
      <br><br>
      <a class="create_tutorial_a_full_width">Beschreibung des Schrittes</a>
      <br>
      <textarea class="create_tutorial_textarea" id="input_description_name0">
      </textarea>
    </div>
  </div>
  
  <div class="step">
    <div class="header_step">Schritt 1 des Tutorial's</div>
    <div class="body_step">
      <a class="create_tutorial_a">Titel des Schrittes</a>
      <input id="input_title_name1" class="create_tutorial_input">
      <br>
      <a class="create_tutorial_a">Bild</a>
      <input type="file">
      <br><br>
      <a class="create_tutorial_a_full_width">Beschreibung des Schrittes</a>
      <br>
      <textarea class="create_tutorial_textarea" id="input_description_name1">
      </textarea>
    </div>
  </div>
  
  
  
  <div class="step">
    <div class="body_step">
      <input class="create_button" id="submit" value="Erstellen" type="button">
      <input class="create_button" id="add_step" value="Schritt hinzufügen" type="button">
      <input class="create_button" id="remove_step" value="Schritt entfernen" type="button">
    </div>
  </div>
  
</form>

如何将此表单发送到我的.php页面，我将把整个数据放入我的数据库？

$.ajax({
    type: "post",
    url: "url",
    data: $("form").serialize(),
    success: function(data) {
       alert("success")
    }
})

我有这个代码，但我不知道如何使用它。什么是成功＆amp;的数据？也许有人可以帮助我。

Answer 1

jQuery已经广泛记录了$.ajax方法here.

的含义和各种用例

基本上，如果请求成功，success是一个要调用的函数。它接受一个数据参数，它是从服务器返回的数据（来自PHP后端）。这是您在将表单数据发送到服务器并且服务器已响应时执行要执行的操作的位置。请注意，服务器中的data不一定必须在success函数中使用。

Answer 2

如何将此表单发送到我的.php页面，我将把它放在整个数据进入我的数据库？

您已将表单方法配置为POST，并将属性action = "index.php?content=create_tutorial"配置为您要调用的端点或脚本，以便对发送的数据执行某些操作。

因此，在提交时，index.php应该使用php全局变量$_POST接收POST数据。

为了简化示例，以下表单使用POST在表单中输入一个文本，并将操作设置为您的终点。

<强> HTML

<form method="post" action="index.php?content=create_tutorial">
  <input type="text" name="name"/><br>
  <input type="submit"/>
</form>

PHP

// index.php
<?php 
  $name = $_POST['name'];
  echo $name;
?>

<强> PHP-MYSQL

// assuming connection to database is configured and setup done
$query = "INSERT INTO `user` (`name`) VALUES ($name)";
mysql_query($query);

注意： - 阅读有关安全性和验证用户输入的更多信息here - 记下属性名称值是$ _POST的关键。 - 阅读有关插入数据库（假设MySQL）here和已弃用 mysql_query()

的信息

我有这个代码，但我不知道如何使用它。什么是成功＆amp; 数据？也许有人可以帮助我。

$.ajax()是一种异步发出HTTP请求的方法。点击Wikipedia

了解更多信息

async = true，简单地说“当你完成时让我知道，我会做其他事情”
async = false就是简单地说“在我做任何其他事情之前我会等你”

默认情况下，$.ajax() async标志设置为true。因为它实现了Promise接口，所以它为您提供了像

这样的功能

从jQuery 1.5.1开始

.done()当响应成功时，将调用此函数。
.fail()当出现错误响应时，将调用此函数。
..更多$.ajax()文档

<强> .PHP

// index.php
<?php
  return "ok";
?>

<强>的.js

var jqxhr = $.ajax( "example.php" )
     .done(function(results) {
       alert(results); // "ok"
     })
     .fail(function(error) {
       alert( error ); // "failed"
     })

弃用通知： jqXHR.success（），jqXHR.error（）和从jQuery 1.8开始，不推荐使用jqXHR.complete（）回调函数。准备你的代码最终删除，使用jqXHR.done（），jqXHR.fail（），和jqXHR.always（）相反。

希望这有帮助。

使用jquery

2 个答案: