Question

以下代码位于单个PHP文件中：

<head>
<script type="text/javascript" src="jquery.js">
function pipeDelete(topicid, msgid, action) {
  if (topicid == 0) {
    var ans = confirm("Delete the topic?");
  } else {
    var ans = confirm("Delete this comment?");
  }
  if (ans) {
    var dest = 'msg_transact.php';
  $.post(dest, {topicid:topicid, msgid:msgid, action:action}, function() {
    $("#" + msgid).hide("slow");
          });
  }
}
</script>
</head>
<?php
// some code, $row['topic_id'] and $row['msg_id'] are integers
while ($row = mysql_fetch_assoc($result)) {
  // some code
  echo '<div id="' . $row['msg_id'] . '">';
  $deletelink = '<a href="#" onclick="pipeDelete(\'' . $row['topic_id'] .
    '\', \'' . $row['msg_id'] . '\', \'deletepost\')">Delete</a>';
  // some code
  echo $deletelink;
  echo '</div>';
}
?>

问题是，当我点击“删除”链接时，页面只是重新加载（“＃”附加在URL的末尾）并且没有任何反应。 onclick事件不会运行，也不会调用该函数。我不认为jquery或 //某些代码会干扰因为要发生这种情况我至少应该得到组合框不是吗？

在调用JS函数时停止onclick事件的问题是什么？

解决方案：编写2个单独的脚本标记 - 一个用于jquery src，另一个用于js代码。 <script type="text/javascript" src="jquery.js"></script> <script type="text/javascript">/* javascript code */</script>

Answer 1

onclick需要“return false”来阻止默认操作（在那里＃锚之后）

现在，您似乎正在使用jQuery。那就是说，为什么不假设你使用html5制作一个非侵入式代码呢？：）

请注意，ID不能只是HTML中的数字

<head>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
  $('.deletelink').click(function(e){
     e.preventDefault();
     var topicid = $(this).attr('data-row'), msgid = $(this).attr('data-msg'), action = $(this).attr('data-action');
  if (topicid == 0) {
    var ans = confirm("Delete the topic?");
  } else {
    var ans = confirm("Delete this comment?");
  }
  if (ans) {
    var dest = 'msg_transact.php';
  $.post(dest, {topicid:topicid, msgid:msgid, action:action}, function() {
    $("#row-" + msgid).hide("slow");
          });
  }
  }); 
</script>
</head>
<?php
// some code, $row['topic_id'] and $row['msg_id'] are integers
while ($row = mysql_fetch_assoc($result)) {
  // some code
  echo '<div id="row-' . $row['msg_id'] . '">';
  $deletelink = '<a href="#" data-row="' . $row['topic_id'] . '" data-msg="' . $row['msg_id'] . '" data-action="deletelink" class="deletelink">Delete</a>';
  // some code
  echo $deletelink;
  echo '</div>';
}
?>

查看使用this jsfiddle

上生成的伪html进行对抗的示例

Answer 2

两个选项：

将"#"替换为"javascript:pipeDelete(..)"并删除onclick属性或通过jquery添加click事件，您可以在此处阻止默认行为。

E.g：

$('#button').click(function(e){
  // do stuff
  ....
  e.preventDefault(); // prevents the default behaviour of a link
});

Answer 3

问题在这里：

$("#" + msgid + "\"").hide("slow");

更改为：

$("#" + msgid).hide("slow");

在这里：

$row['msg_id'] . '\', \"deletepost\")">Delete</a>';

更改为：

$row['msg_id'] . '\', \'deletepost\')">Delete</a>';

在这里：

<script type="text/javascript" src="jquery.js">

更改为：

<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">

请参阅： http://jsfiddle.net/AUTrX/

您无需更改"#"或return false; - "#"将不会重新加载页面，只是将页面移动到内部锚点所在的位置提供并指定一个。

使用PHP vars的JS函数on {<a> tag is not working</a>

3 个答案: