Javascript/PHP 重定向
Posted
技术标签:
【中文标题】Javascript/PHP 重定向【英文标题】:Javascript/PHP redirect 【发布时间】:2013-09-27 02:37:12 【问题描述】:各位程序员大家好!
我正在从事一个个人项目(主要是为了学习 php/javascript),并且在单击链接时遇到了重定向问题。我在创建的标签页上遇到了一些奇怪的情况,我认为这可能是导致我的问题的原因。
我正在尝试允许用户单击(由于 css 使其看起来与正常情况不同)以将它们重定向到具有更多详细信息的新页面。我认为我页面上的第二个标签让我很反感,因为我有一个表单。
我已经尝试了很多不同的东西,比如 window.location.href=""、location.href=""、document.location="" 等等......但同样的事情总是会发生。我能够收到两条警报消息,所以我知道我正在进入我的 JavaScript(即使我将它放入它自己的 .js 文件中)。
无论如何建议/帮助都会非常有帮助。此外,如果有人对清理此代码有任何建议,那也将非常有帮助。
以下基本上是我所拥有的。
提前感谢您的帮助!
<html>
<head>
<title>test site</title>
<link rel="stylesheet" href="test.css" type="text/css" media="screen" />
<script src="test.js" type="text/javascript"></script>
<script type="text/javascript">
function viewDetails(modelId)
alert(modelId);
window.location.href="new url?ModelID=" + modelId;
alert('redirecting would be way awesome...');
</script>
</head>
<body onload="load()">
<div id="tabbed_box_1" class="tabbed_box">
<h4>Navigation Tabs<small>Select a tab</small></h4>
<div class="tabbed_area">
<?php
mysql_connect('host','user','password');
mysql_select_db("database");
echo "<ul class='tabs'>";
echo "<li><a href='javascript:tabSwitch(1, 2);' id='tab_1' class='active'>Inventory</a></li>";
echo "<li><a href='javascript:tabSwitch(2, 2);' id='tab_2' >Add Project</a></li>";
echo "</ul>";
echo "<div id='content_1' class='content'>";
echo "<ul>";
$modelsSQL = "SELECT * FROM Model ORDER BY Name";
$modelsResult = mysql_query($modelsSQL);
while ($modelRow = mysql_fetch_array($modelsResult))
$modelID = $modelRow[0];
$sqlAvailCount = "SELECT * FROM Project WHERE ModelID = " . $modelID . " AND Sold = 0";
$sqlSoldCount = "SELECT * FROM Project WHERE ModelID = " . $modelID . " AND Sold = 1";
$resultAvailCount = mysql_query($sqlAvailCount);
$resultSoldCount = mysql_query($sqlSoldCount);
$rowAvailCount = mysql_num_rows($resultAvailCount);
$rowSoldCount = mysql_num_rows($resultSoldCount);
echo "<li><a href='' onclick='javascript:viewDetails($modelID);'>" . $modelRow[1] . "<small>in stock: <value>"
. $rowAvailCount . "</value> sold: <value>" . $rowSoldCount . "</value></small></a></li>";
echo "</ul>";
echo "</div>";
echo "<div id='content_2' class='content'>";
echo "<form action='project_insert.php' method='post' name='projectAddForm'>";
echo "<table cellpadding='5'>";
// Project Model Selection
echo "<tr><td>";
echo "<label for='model'>Model</label>";
echo "</td><td>";
echo "<select name='model' style='width: 250px;'>";
echo "<option value='-1' selected>SELECT</option>";
$modelListSQL = "SELECT * FROM Model ORDER BY Name";
$modelListResult = mysql_query($modelListSQL);
while ($modelListRow = mysql_fetch_array($modelListResult))
echo "<option value='" . $modelListRow['ID'] . "'>" . $modelListRow['Name'] . "</option>";
echo "</select>";
echo "</td></tr>";
// Project Material Selection
echo "<tr><td>";
echo "<label for='material'>material</label>";
echo "</td><td>";
echo "<select name='material' style='width: 250px;'>";
echo "<option value='-1' selected>SELECT</option>";
$materialListSQL = "SELECT * FROM Material ORDER BY Name";
$materialListResult = mysql_query($materialListSQL);
while ($materialListRow = mysql_fetch_array($materialListResult))
echo "<option value='" . $materialListRow['ID'] . "'>" . $materialListRow['Name'] . "</option>";
echo "</select>";
echo "</td></tr>";
// Project Finish Selection
echo "<tr><td>";
echo "<label for='finish'>finish</label>";
echo "</td><td>";
echo "<select name='finish' style='width: 250px;'>";
echo "<option value='-1' selected>SELECT</option>";
$finishListSQL = "SELECT * FROM Finish ORDER BY Name";
$finishListResult = mysql_query($finishListSQL);
while ($finishListRow = mysql_fetch_array($finishListResult))
echo "<option value='" . $finishListRow['ID'] . "'>" . $finishListRow['Name'] . "</option>";
echo "</select>";
echo "</td></tr>";
// Project Craftsman Selection
echo "<tr><td>";
echo "<label for='craftsman'>craftsman</label>";
echo "</td><td>";
echo "<select name='craftsman' style='width: 250px;'>";
echo "<option value='-1' selected>SELECT</option>";
$craftsmanListSQL = "SELECT * FROM Craftsman ORDER BY FirstName";
$craftsmanListResult = mysql_query($craftsmanListSQL);
while ($craftsmanListRow = mysql_fetch_array($craftsmanListResult))
echo "<option value='" . $craftsmanListRow['ID'] . "'>" . $craftsmanListRow['FirstName'] . " " . $craftsmanListRow['LastName'] . "</option>";
echo "</select>";
echo "</td></tr>";
//Project Description
echo "<tr><td>";
echo "<label for='description'>Description</label>";
echo "</td><td>";
echo "<input type='text' name='description' id='textArea' style='width:250px'>";
echo "</td></tr>";
// Project Selling Price
echo "<tr><td>";
echo "<label for='price'>Price</label>";
echo "</td><td>";
echo "<input id='price' name='price' type='number' style='width:150px'>";
echo "</td></tr>";
// Project Completion Date
echo "<tr><td>";
echo "<label for='date'>Finish Date</label>";
echo "</td><td>";
$dateArray = getdate();
$month = $dateArray[mon];
$day = $dateArray[mday];
if ($month < 10)
$month = '0' . $dateArray[mon];
if ($day < 10)
$day = '0' . $dateArray[mday];
$todaysDate = $dateArray[year] . '-' . $month . '-' . $day;
echo "<input type='date' name='date' value='" . $todaysDate . "' style='width:150px'>";
echo "</td></tr>";
// Buttons
echo "<tr><td align='center'>";
echo "<input type='button' name='Save' value='Save' onclick='javascript:validateAndSubmit(this.form);' style='width:100px'>";
echo "</td><td align='center'>";
echo "<input type='button' name='Cancel' value='Cancel' onclick='javascript:cancelEntry();' style='width:100px'>";
echo "</td></tr>";
echo "</table>";
echo "</form>";
echo "</div>";
?>
</div>
</div>
</body>
【问题讨论】:
mysql_*
函数不再维护,不应在任何新代码库中使用。它正在逐步淘汰,以支持更新的 API。相反,您应该将prepared statements 与PDO 或MySQLi 一起使用。此外,您应该放置脚本,而不是附加函数 onload
,您希望在页面加载后运行,就在关闭 </body>
标记之前。
测试时浏览器控制台是否出现错误?
terSKo:感谢您的建议,我会调查并在不久的将来开始更改这些建议。
Aaran:不幸的是,我在运行它时没有发现任何错误。我正在使用 Chromium 进行开发,但在那里没有找到任何东西。我也在 FireFox 中测试过,没有发现任何错误。我还没有尝试过 IE,因为我目前正在使用 Ubuntu 进行开发。
尝试将这个:onclick='javascript:viewDetails($modelID);'
更改为这个:onclick='viewDetails($modelID);'
。无论如何,您确实不应该使用伪控制,但onclick='javascript:
毫无意义,可能会很麻烦。
【参考方案1】:
window.location.href 在某些浏览器和情况下可能不会触发重新加载.. 您应该在
之后添加重新加载像这样:
window.location.href = '/foo/bar/';
window.locaton.reload(true)
但是,有些浏览器会延迟毫秒来执行 location.href 设置。在这种情况下,window.location.reload(true) 可能会在此之前完成。
因此,在重新加载时添加超时:
window.location.href = '/foo/bar/';
setTimeout('window.locaton.reload(true)', 500);
适用于我的所有浏览器
【讨论】:
古斯塔沃:谢谢你的建议。不幸的是,这似乎并没有解决我的问题,因为我发生了同样的行为。它似乎真的很喜欢我的主页,不想让我转移到任何地方。【参考方案2】:早上好!我今天早上找到了问题的原因,并且能够解决问题。我引起的问题是因为我使用标签(由 css 样式化)来显示信息,并使用 onclick 事件调用我的 JS 代码进行重定向。在标签中我有 href='',认为 JS 会覆盖该功能,它没有!
从标签中删除 href='' 解决了问题并允许我重定向到新页面。第二种解决方案是使用我的 php 代码在标签内动态创建 href 链接。
echo "<li><a onclick='viewDetails($modelID);'>" . $modelRow[1] . "<small>in stock: <value>" . $rowAvailCount . "</value> sold: <value>" . $rowSoldCount . "</value></small></a></li>";
或
echo "<li><a href='inventorydetails.php?ModelID=" . $modelID . "'>" . $modelRow[1] . "<small>in stock: <value>" . $rowAvailCount . "</value> sold: <value>" . $rowSoldCount . "</value></small></a></li>";
我想我会选择第二个例子,原因有两个。首先,它在悬停时提供链接图标(我知道我可以通过css添加,但这更容易。其次,更少的JS代码。
感谢您为解决此问题提供的所有帮助!
【讨论】:
以上是关于Javascript/PHP 重定向的主要内容,如果未能解决你的问题,请参考以下文章