[英]Javascript/PHP interaction only appears on second click
尋找答案,但沒有喜悅,所以這里...
我正在開發移動混合應用程序。 我希望用戶填寫其ID號,然后將其提交給javascript函數以進行基本驗證,然后向服務器端PHP發起一個jQuery.getJSON請求,該請求將返回數據,然后我的jQuery將用數據。
目前,它實際上根本無法在Firefox中使用,只有在我再次按下提交按鈕后才能在Safari中正常使用。 它返回正確的數據,因此鏈接正常。
我的問題是:為什么第一次單擊后div不會重新填充?
HTML:
<div id="login540div">
<form id="login540form" onSubmit="login540()">
Enter Student ID number<input type="text" name="login540id" id="login540id"/>
<input type="submit" value="Submit" />
</form>
</div>
Javascript:
function login540(){
// validates the data entered is an integer.
var loginNo = document.getElementById("login540id").value;
//if(!isNaN(loginNo))
if((parseFloat(loginNo) == parseInt(loginNo)) && !isNaN(loginNo))
{
//jSonCaller(loginNo);
$.getJSON('http://localhost:8888/c05673160/login540.php?q='+loginNo, function(data){
//alert(data);
$('#login540div').html("<p>First Name ="+
data.firstName+
"</p> Last Name ="+data.lastName+" </p>Module No.1 ="+
data.moduleNo1+"</p> Module No.2 ="+
data.moduleNo2+"<p> Course ID="+
data.courseID+"</p>");
})
}
else
{
// alert(loginNo); CHECKED
alert("Please make sure to insert only a whole number");
}
然后PHP像這樣...
<?php
include ("config.php");
/*
require_once('FirePHPCore/FirePHP.class.php');
ob_start();
$firephp = FirePHP::getInstance(true);
$var = array('i'=>10, 'j'=>20);
$firephp->log($var, 'Iterators');
*/
$dbhost = 'localhost';
$dbuser = 'root';
$dbpass = 'root';
$dbname = 'collegeData';
$q=$_GET["q"];
$table = "studentTable";
$conn = mysql_connect($dbhost, $dbuser, $dbpass);
if (!$conn)
die('Could not connect: ' . mysql_error());
if (!mysql_select_db($dbname))
die("Can't select database");
$result = mysql_query("SELECT * FROM {$table} WHERE studentID = '".$q."'");
if (!$result)
die("Query to show fields from table failed!" . mysql_error());
$json = array();
while($row = mysql_fetch_array ($result))
{
$json = array(
'firstName' => $row['firstName'],
'lastName' => $row['lastName'],
'moduleNo1' => $row['moduleNo1'],
'moduleNo2' => $row['moduleNo2'],
'courseID' => $row['courseID']
);
}
$jsonstring = json_encode($json);
echo $jsonstring;
mysql_close($conn);
?>
我無法弄清楚出了什么問題,最近幾天我一直在忙於解決各種問題,但沒有任何樂趣,因此,我非常感謝您能提供的任何幫助。
缺少函數login540()的底部,但這需要取消默認的“提交”操作:可以通過“ return false;”來完成。 在最后。 我看不到結尾,不確定是否會發生這種情況,但是在AJAX運行時表單可能會“提交”。
由於表單沒有動作,這很復雜,這可能解釋了不同的瀏覽器行為。 我建議將操作設置為“#”,然后,如果您看到URL中添加了“#”,則表示表單已提交並且未被您的函數阻止。
@Robbie指出,您似乎並沒有停止表單提交的默認行為。 為此,您需要更改以下幾項:
onSubmit="login540()"
需要更改為onSubmit="return login540()"
否則您從login540()
函數返回的任何內容都將被忽略。 login540()
函數的最后,您需要return false;
阻止表單正常提交。 您還可以將event
對象作為第一個參數傳遞,並使用event.preventDefault()
代替: function login540(event){event.preventDefault();...}
。 為了幫自己一個忙,您可以使用jQuery將submit
事件處理程序綁定到表單,而不是使用內聯JS(tisk,tisk,:))
$('#login540form').on('submit', login540);
這樣,您可以將所有JS放在一個位置,而不是擴展到整個HTML。
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.