我一直在一個頁面上有3個輸入字段和3個按鈕。輸入字段是Date,Territory和Town,而按鈕是Save,Back和Add。 保存和添加按鈕被禁用,直到用戶在3個輸入字段中輸入值。當用戶在日期和城鎮字段中輸入值時,會出現一個表格。領土字段過濾城鎮字段中的內容/選項。問題是,放置在服務器上的JavaScript不起作用。Javascript在本地但不在服務器上工作
這裏是內嵌Javascript的HTML代碼。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description" content="">
<link rel="icon" href="../images/logo.ico">
<link rel="stylesheet" type="text/css" href="../css/allStyle.css">
<link rel="stylesheet" href="../css/jquery-ui.css" />
<link rel="stylesheet" href="../css/runnable.css" />
<script src="../js/datepick.js"></script>
<script src="../js/datepick1.js"></script>
<script src="../js/script.js"></script>
<script type ="text/javascript">
//DISABLING SAVE AND ADD WHEN INPUT FIELDS ARE EMPTY
$(function(){
//Set button disabled
$("#subAdd").attr("disabled", "disabled");
$("#subSv").attr("disabled", "disabled");
//Append a change event listener to input
$("input[name='txtDay']").change(function(){
if($(this).val().length > 0) {
$("input[type='submit']").removeAttr("disabled");
}
});
$("input[name='terlist']").change(function(){
if($(this).val().length > 0) {
$("input[type='submit']").removeAttr("disabled");
}
});
$("input[name='town-list']").change(function(){
if($(this).val().length > 0) {
$("input[type='submit']").removeAttr("disabled");
}
});
//trigger the a change event
$("input[name='txtDay'], input[name='town-list'], input[name='terlist']").trigger('change');
});
</script>
<script type ="text/javascript">
//GETTING SAVED MCP RECORDS DATABASE
function getData(val){
$.ajax({
type: "POST",
url: "mcp_getdate.php",
data:'target_date='+val,
success: function(data){
$("#list-added").html(data);
document.getElementById("town-list").onchange();
}
});
}
</script>
<script type ="text/javascript">
//GETTING TERRITORIES IN DATABASE
function getTown(val){
$.ajax({
type: "POST",
url: "mcp_gettown.php",
data:'territory_id='+val,
success: function(data){
$("#town-list").html(data);
}
});
}
</script>
<script type ="text/javascript">
//GETTING DATABASE VALUES FOR ADD
function submitForm() {
var myDate = document.getElementById("datepicker").value;
var myFrame = document.getElementById("mcpFrame");
var myCheckboxes = new Array();
$("input:checked").each(function() {
myCheckboxes.push($(this).val());
});
$.ajax({
type: "POST",
url: "mcp_set.php",
dataType: 'html',
data: 'search_value='+myCheckboxes+'&date_value='+myDate+'&mcpFrame'+myFrame,
success: function(data){
$("#list-added").html(data);
document.getElementById("town-list").value = "";
document.getElementById("town-list").onchange();
}
});
return false;
}
</script>
<script type ="text/javascript">
// SETTING CHECKBOXES
function getSchool(val){
var myDate = document.getElementById("datepicker").value;
$.ajax({
type: "POST",
url: "mcp_settown.php",
data:'town_id='+val+'&target_date='+myDate,
success: function(data){
$("#school-list").html(data);
}
});
}
</script>
</head>
<body>
<!--HEADER-->
<table class="table tableser">
<tr>
<td class="tableser" width="50%"></td>
<?php
if(empty($_SESSION["user_id"])) {
header('Location: ../login/index.php');
exit();
}
else{
if($_SESSION["dept_id"] == 2) {
?>
<td class="tableser" align="right" style="vertical-align:bottom" width="50%"><b><?php echo "NAME : " . $_SESSION["emp_name"]; ?></b></td>
<?php
}
if($_SESSION["dept_id"] != 2) {
session_unset();
// destroy the session
session_destroy();
header('Location: ../login/index.php');
exit();
}
}
?>
<td class="tableser" width="4%" style="vertical-align:bottom" align="right"><b><a href="../logout/index.php">(LOGOUT)</a></b></td>
</tr>
</table>
<hr>
<!--Save and Back -->
<table class="tableser">
<tr>
<td class="tableser" width="90%"><b>Monthly Call Plan Entry</b></td>
</tr>
<tr>
<td class="tableser">
<form method="post" id="myForm" name="myForm" action="<?php echo htmlspecialchars($_SERVER["PHP_SELF"]);?>">
<input type="submit" id="subSv" name="subSv" value="Save" style="height:25px; width:80px; font-face: 'Comic Sans MS'; font-size: larger"/>
</form>
</td>
<td class="tableser" align = "right">
<form method="post" id="myForm" name="myForm" action="<?php echo htmlspecialchars($_SERVER["PHP_SELF"]);?>">
<input type="submit" name="subHd" value="Back" style="height:25px; width:80px; font-face: 'Comic Sans MS'; font-size: larger"/>
</form>
</td>
</tr>
</table>
<hr>
<!--CONTENT-->
<form method="post" id="myForm" name="myForm" action="">
<table class="tableser">
<tr>
<td class="tableser">Date</td>
<td class="tableser">
<input type="text" name="txtDay" id="datepicker" placeholder="Enter date." size="35px" onChange="getData(this.value);" required />
</td>
</tr>
<tr>
<td class="tableser">Territory</td>
<td class="tableser">
<select name="terlist" id="terr-list" style="height:25px; width:279px; font-face: 'Comic Sans MS'; font-size: larger" onChange="getTown(this.value);">
<option value="" selected="selected">Select Territory..</option>
<?php
$sqlTer = "SELECT DISTINCT tbl_all.territory_id, tbl_all.user_id , tbl_territory.province FROM tbl_all
JOIN tbl_territory ON tbl_all.territory_id = tbl_territory.territory_id
WHERE user_id = ".$_SESSION["user_id"]." ";
$result_sqlTer = $conn->query($sqlTer);
while($row = $result_sqlTer->fetch_assoc())
{
?>
<option value="<?php echo $row["territory_id"]; ?>"><?php echo $row["province"]; ?></option>
<?php
}
?>
</select>
</td>
</tr>
<tr>
<td class="tableser">Town</td>
<td class="tableser">
<select name="townlist" id="town-list" style="height:25px; width:279px; font-face: 'Comic Sans MS'; font-size: larger" onChange="getSchool(this.value);" >
<option value="" selected="selected">Select Town..</option>
</select>
</td>
</tr>
</table>
<br>
<div id="school-list" style="overflow-y: auto;" >
</div>
<br>
<input type="submit" id="subAdd" name="subAdd" value="Add" onclick="return submitForm()" style="height:25px; width:80px; font-face: 'Comic Sans MS'; font-size: larger" />
<br>
</form>
<br>
<div id= "list-added" style="overflow-y: auto;">
</div>
<center>
<iframe id="mcpFrame" name="mcpFrame" style="visibility:hidden;display:none"></iframe>
</center>
</body>
</html>
控制檯上的任何錯誤 – CodeLove
您不在任何地方包含jQuery,它是否是其他腳本之一? – jeroen
爲了清楚起見,服務器將html/javascript發送到客戶端(通常是瀏覽器),然後呈現您的頁面並運行您的JavaScript代碼。那是你正在嘗試做什麼? – user2263572