Question

情况是，当我点击该行时，它会将我引导至“查看页面”或点击“更新按钮”将指示我进入“更新窗口”。现在我希望删除和更新按钮在一行中包含名称和地址值。

我试图对齐它并且单击该行没有问题，它将我引导到“查看页面”但每次单击“更新按钮”时，它会弹出两个窗口，即“视图窗口” “和”更新窗口“，其中它应该只是弹出的”更新窗口“。

所以如何让更新页面不会影响视图页面。

这是我工作的链接图片：

（这还没有对齐，因为当我尝试上面遇到问题时）http://www.fileden.com/files/2011/7/27/3174077/My_Documents/a.JPG

这是它的代码：

<link href="main.css" rel="stylesheet" type="text/css" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Principal Page</title>

<script type="text/javascript">

function pop_up(id) {
var newWind = window.open( "view_principal.php?id="+id, "myWindow", 
"status = 1, height = 200, width = 400, resizable = 0" );
}

function goModify(id)
{
window.location.href = "modify_principal.php?id=" + id;
}

function goDelete(id)
{
var answer = confirm ("Are you sure you want to delete?")

if (answer)
   window.location.href = "delete_principal.php?id=" + id;
}

function ChangeColor(tableRow, highLight)
{
if (highLight)
{
  tableRow.style.backgroundColor = '#66CCFF';
}
else
{
 tableRow.style.backgroundColor = '#69F';
}

 }

 function DoLink(theUrl)
{
document.location.href = theUrl;
}

</script>



</head>

<body>

<p>
<?php
require_once ('include/config.php');
require_once ('include/opendb.php');
$query = mysql_query("SELECT * FROM principal");
echo "</br>";
echo "<br>";
echo "<div class='divMainTable'>";
echo "<table border='1' >
  <tr class = 'headertable'>
    <th width = '200'> Name</th>
    <th> Address</th>
 </tr>";

while($row = mysql_fetch_array($query)){
echo "<tr onclick = 'pop_up($row[principal_ID])');return false;'      onmouseover='ChangeColor(this, true);' onmouseout='ChangeColor(this, false);'>";


echo "<td>".$row['name']."</td>";
echo "<td>".$row['address']."</td>"; 

echo "</tr>";
echo "</table>";
echo "</div>";

echo "<div class='divSecondTable'>";
echo "<table class='updatetable' border='1'>";
echo "<tr class='dataTable'>";
echo "<td align='center'>"."<input type='button' name='update' value='Update' 
onClick='goModify($row[principal_ID])');>"."</td>";

echo "<td align='center'>"."<input type='button' name='delete' value='Delete' 
onClick='goDelete($row[principal_ID])');>"."</td>";
echo "</tr>";
echo "</table>";
echo "</div>";

}



?>

<form id="form1" name="form1" method="post" action="add_principal.php">
<p class="add_option">
<input type="submit" name="add" id="button" value="ADD" />
</p>
</form>
</body>
</html>

Answer 1

两个窗口弹出的原因是因为事件冒泡。触发输入标记上的事件，然后触发tr标记上的事件。

您需要使用

停止传播

event.stopPropagation()

在你的功能中。如果您在脚本中绑定事件而不是编写内联事件处理程序，这实际上更容易实现。

更新：

在您的示例中，因为您正在传递参数，所以还需要传递事件对象。

所以你将内联事件需要事件添加到参数中，并且应该如下所示：

<input type="button" name="update" value="Update" onClick="goModify(event, $row[principal_ID]);">

然后在你的函数中你需要接受这个事件，所以你的函数现在变成了：

function goModify(event, id)
{
    event.stopPropagation();
    event.cancelBubble = true; // for ie
    window.location.href = "modify_principal.php?id=" + id;
}

您可以对删除按钮和js功能执行相同的操作。

如何仅通过单击该行中的一个值来显示一行中的所有值

1 个答案: