我想要实现的目标:在 HTML 窗口中单击一个按钮，然后打开一个包含文本框和提交按钮的弹出窗口。我在文本框中输入文本，单击提交按钮后，文本应使用 SQl 存储在数据库中。
我有代码(见下文)来获取文本框值，并调用另一个脚本将该值存储在数据库中。
我的 AJAX 代码
$(document).ready(function() {
$("#sub").click(function() {
$.ajax({
type: "POST",
url: "jqueryphp.php",
data: {
val: $("#val").val()
},
success: function(result) {
$("div").html(result);
}
});
});
});
HTML 表单代码
<input type="text" name="val[text]" id="val"/><br>
<input type="button" name="sub" value="submit" id="sub"/>
如何将这些部分组合在一起？
最佳答案
您可以使用如下 HTML 表单:
<html>
<head>
<script type="text/javascript"
src="http://code.jquery.com/jquery-1.10.2.js"> </script>
<script type="text/javascript"
src="addEntryFormAjax.js"> </script>
</head>
<body>
<form id="form">
<input type="text" id="blogText" name="blogText" size="40" />
<input type="submit" id="submit" value="submit"/>
</form>
<div id="result">
None
</div>
</body>
HTML 表单使用 JavaScript 附加提交处理程序 (addEntryFormAjax.js):
$(document).ready(function() {
$("#form").submit(function() {
doAjax();
// Prevent normal form submit
return false;
});
});
function doAjax() {
$("#result").html("<span>Calling ...</span>");
$.ajax({
type: "POST",
url: "addEntryAjaxPdo.php",
dataType: "html",
data: {
blogText: $("#blogText").val()
},
success: function(result) {
$("#result").html(result);
}
});
}
如果按下提交按钮，提交处理程序将使用 AJAX 调用 PHP 脚本 addEntryAjaxPdo.php 将数据插入数据库:
<div>
<?php
// Sleep 3s, simulate a long running request
sleep(3);
$host = "localhost";
$db = "sandbox";
$user = "dev";
$pass = "dev";
$conn = new PDO("mysql:host=$host;dbname=$db", $user, $pass);
$stmt =
$conn->prepare(
"insert into blog (blogText, blogTimestamp) values (:blogText, now())");
$stmt->bindParam(':blogText', $_REQUEST['blogText']);
$stmt->execute();
$sql = "select last_insert_id()";
$query = $conn->query($sql);
$row = $query->fetch(PDO::FETCH_ASSOC);
echo "Inserted <em>" . $_REQUEST['blogText'] . "</em> into blog, id is "
. $row['last_insert_id()'];
?>
</div>
AJAX 调用的状态/结果显示在 HTML 页面的 div 元素中。
关于php - 如何将文本框的值存储到数据库中？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/18160888/