Tim*_*PQR 1 ajax getelementbyid
伟大的网站,精湛的贡献者,我提前谢谢你.
(咆哮)> 72小时,头发减少50%,谷歌搜索".ajax简单例子"=网上没有简单,实用的例子 - : - )(/ rant)
我正在从表单中收集数据,将该数据传递给javascript例程,该例程启动写入我的数据库的php文件.一切都很好 - 这里是SIMPLE,WORKING脚本:
<script type="text/javascript">
$(document).ready(function(e) {
$("#submitbutton").click(function() {
var ln = 'DaVinci';
var fn = 'Leonardo';
$.ajax({
type: "POST",
url: "testbackendinsert.php",
data: {lastname: ln, firstname: fn}
})
.done( function( msg ) {alert( "Data Saved: " + msg );});
});
});
</script>
我可以将任何字符串放入ln和fn变量,数据最终在db中.
当我把表单放入(简单,一个输入,一个按钮)时:
<form><table>
<tr><td>First Name</td><td><input type="text" id="fn" name="FirstName"></td></tr>
<tr><td colspan="2"><input type="submit" id="submitbutton" value="Submit" /></td></tr>
</table></form>
并使用该行
var ln = document.getElementById("fn");
代替var ln ="Somedudesname"; 它不起作用,或CRASHES(是的,崩溃,挂起)IE(我必须关闭并重新打开).我试过("fn"),('fn'),(#fn),('#fn'),("#fn")而没有去.我确定这是微不足道的(总是如此) - 我错过了什么？
HTML/JavaScript的
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/javascript" src="jquery-1.9.1.js"></script>
<title>test ajax frontend</title>
<style>
#divtest {
width:40%;
background-color:#C1C1FD;
text-align:left;
margin-left:auto;
margin-right:auto;
margin-top:5%;
font-size:16px;
line-height:16px;
border: 20px solid #FCD1E3;}
</style>
</head>
<body>
<div id="divtest">
<form>
<table>
<tr><td>First Name:</td><td><input type="text" id="fn" name="FirstName"></td></tr>
<tr><td>Last Name:</td><td><input type="text" id="ln" name="FirstName"></td></tr>
<tr><td>Zip code:</td><td><input type="text" id="zp" name="FirstName"></td></tr>
<tr><td colspan="2"><input type="submit" id="submitbutton" value="Submit" /></td></tr>
</table>
</form>
</div>
<script type="text/javascript">
$(document).ready(function(e) {
$("#submitbutton").click(function() {
var ln = document.getElementById("ln").value;
var fn = document.getElementById("fn").value;
var zp = document.getElementById("zp").value;
$.ajax({
type: "POST",
url: "testbackendinsert.php",
data: {lastname: ln, firstname: fn, zip: zp}
})
.done( function( msg ) {alert( "Data Saved: " + msg );});
});
});
</script>
<!--
document.getElementById("fn")
document.getElementById("ln")
-->
</body>
<?php
echo "<title>Read db table.php</title>";
$ln = $_POST['lastname'];
$fn = $_POST['firstname'];
$z = $_POST['zip'];
$host = "name of host";
$user = "username";
$password = "password";
$dbname = "dbname";
$cxn = mysqli_connect($host,$user,$password,$dbname);
if (mysqli_connect_errno()) {echo "No connection" . mysqli_connect_error();}
echo "connection made";
$query = "INSERT INTO testtable (lastname, firstname, zip) VALUES ('$ln', '$fn', '$z')";
$result = mysqli_query($cxn, $query) or die ("No query");
mysqli_close($cxn);
?>
祝大家愉快!再次感谢!
您可能想要获取该元素的值:
var ln = document.getElementById("fn").value;
或者使用jQuery:
var ln = $("#fn").val();
| 归档时间： |
|
| 查看次数： |
16602 次 |
| 最近记录： |