我有这个小点击计数器.我希望在
mysql表中包含每个点击.有人可以帮忙吗?
- var count1 = 0;
- function countClicks1() {
- count1 = count1 + 1;
- document.getElementById("p1").innerHTML = count1;
- }
- document.write('<p>');
- document.write('<a href="javascript:countClicks1();">Count</a>');
- document.write('</p>');
- document.write('<p id="p1">0</p>');
万一有人想看看我做了什么:
- var count1 = 0;
- function countClicks1() {
- count1 = count1 + 1;
- document.getElementById("p1").innerHTML = count1;
- }
- function doAjax()
- $.ajax({
- type: "POST",url: "PHPfile.PHP",data: "name=name&location=location",success: function(msg){
- alert( "Data Saved: " + msg );
- }
- });
- }
- document.write('</p>');
- document.write('<a href="javascript:countClicks1(); doAjax();">Count</a>');
- document.write('</p>');
- document.write('<p id="p1">0</p>');
这是PHPfile.PHP,用于测试目的将数据写入txt文件
- <?PHP
- $name = $_POST['name'];
- $location = $_POST['location'];
- $myFile = "test.txt";
- $fh = fopen($myFile,'w') or die("can't open file");
- fwrite($fh,$name);
- fwrite($fh,$location);
- fclose($fh);
- ?>
解决方法
您的问题中定义的JavaScript无法直接与MysqL一起使用.这是因为它不在同一台计算机上运行.
JavaScript在客户端(浏览器)中运行,数据库通常存在于服务器端.您可能需要使用中间服务器端语言(如PHP,Java,.Net或像Node.js这样的服务器端JavaScript堆栈)执行查询.
这里有一个关于如何编写一些将PHP,JavaScript和MysqL绑定在一起的代码,以及在浏览器和服务器上运行的代码的教程:
http://www.w3schools.com/php/php_ajax_database.asp
这里是该页面的代码.它不完全符合您的方案(它执行查询,并且不将数据存储在数据库中),但它可能有助于您开始了解您需要的交互类型,以使其工作.
JavaScript的位:
- xmlhttp.open("GET","getuser.PHP?q="+str,true);
- xmlhttp.send();
此外,在您了解了这种代码的工作原理之后,我建议您使用use the jQuery JavaScript library to do your AJAX calls.与内置的AJAX支持相比,它更加干净,更容易处理,您不必编写特定于浏览器的代码,因为jQuery具有内置的跨浏览器支持.这是the jQuery AJAX API documentation的页面.
HTML / Javascript代码:
- <html>
- <head>
- <script type="text/javascript">
- function showUser(str)
- {
- if (str=="")
- {
- document.getElementById("txtHint").innerHTML="";
- return;
- }
- if (window.XMLHttpRequest)
- {// code for IE7+,Firefox,Chrome,Opera,Safari
- xmlhttp=new XMLHttpRequest();
- }
- else
- {// code for IE6,IE5
- xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
- }
- xmlhttp.onreadystatechange=function()
- {
- if (xmlhttp.readyState==4 && xmlhttp.status==200)
- {
- document.getElementById("txtHint").innerHTML=xmlhttp.responseText;
- }
- }
- xmlhttp.open("GET",true);
- xmlhttp.send();
- }
- </script>
- </head>
- <body>
- <form>
- <select name="users" onchange="showUser(this.value)">
- <option value="">Select a person:</option>
- <option value="1">Peter Griffin</option>
- <option value="2">Lois Griffin</option>
- <option value="3">Glenn Quagmire</option>
- <option value="4">Joseph Swanson</option>
- </select>
- </form>
- <br />
- <div id="txtHint"><b>Person info will be listed here.</b></div>
- </body>
- </html>
- <?PHP
- $q=$_GET["q"];
- $con = MysqL_connect('localhost','peter','abc123');
- if (!$con)
- {
- die('Could not connect: ' . MysqL_error());
- }
- MysqL_select_db("ajax_demo",$con);
- $sql="SELECT * FROM user WHERE id = '".$q."'";
- $result = MysqL_query($sql);
- echo "<table border='1'>
- <tr>
- <th>Firstname</th>
- <th>Lastname</th>
- <th>Age</th>
- <th>Hometown</th>
- <th>Job</th>
- </tr>";
- while($row = MysqL_fetch_array($result))
- {
- echo "<tr>";
- echo "<td>" . $row['FirstName'] . "</td>";
- echo "<td>" . $row['LastName'] . "</td>";
- echo "<td>" . $row['Age'] . "</td>";
- echo "<td>" . $row['Hometown'] . "</td>";
- echo "<td>" . $row['Job'] . "</td>";
- echo "</tr>";
- }
- echo "</table>";
- MysqL_close($con);
- ?>