javascript onclick函数上的asp.net页面重新加载答案

【问题标题】：asp.net page reloading on javascript onclick functionjavascript onclick函数上的asp.net页面重新加载
【发布时间】：2010-08-18 13:11:12
【问题描述】：

我猜是新手问题：

情景：
我有一个 asp.net 页面，其中包含 6 个 div 和 6 个链接到 javascript 函数的超链接：

function showdiv(divname)
{
   hideallcontentdivs();
   var targetdiv = document.getElementById(divname);
   targetdiv.style.display="block";
}

var alldivs=new Array();
function hideallcontentdivs()
{
   alldivs=document.getElementsByTagName("div");
   for(var i=0; i<alldivs.length;i++)
   {
      if(alldivs[i].className=="content")
      {
         alldivs[i].style.display="none";
      }
   }
}

图像按钮：

<a href="" onclick="showdiv('item1');"><img alt="alternate_text" src="imagesource" border="0px" /></a>

div 的 id 为：item1、item2....item6 和超链接向 javascript 函数指定需要显示的 div 的 id。

问题：
每当我点击一个超链接时，我想要的效果就实现了，但页面也会重新加载。真的不知道我哪里错了，但如果有人能指引我正确的方向，我将非常感谢。

【问题讨论】：

您正在使用锚标记。但是，您说您使用的是 ASP.NET ImageButton 控件。前者用于重定向到任何 url。

标签： javascript asp.net animation html

【解决方案1】：

点击返回false

onclick="showdiv('item1');return false;"

更新：我只是指出问题:)，你可以在任何你喜欢的地方返回 false。

onclick="return showdiv('item1');"

然后告诉 showdiv() 返回 false

【讨论】：

非常感谢先生！正如我所提到的，这就像一个魅力，这确实是一个新手问题，因为 Javascript 对我来说仍然像中文，刚刚开始学习它。再次感谢。
你能不能只做 onclick="showdiv('item1');"当您在 showdiv 方法中有“return false”时没有“return”语句？保存一个单词和相同的结果。
正如我在回答中所写的，我强烈建议您查看jQuery。将行为直接写入 html 的 onSomeEvent 属性是一种不好的风格。
@Dave 我同意你对 jQuery 的看法，我只是指出了回报。 @Stefanvds 是的，它的工作原理是一样的，我只是在我的代码样式中使用 return （当我不使用 jQuery 时）来提醒我我需要返回一些东西并 100% 确定它是返回它。有时返回值可能是真或假取决于函数内部的某些条件。

【解决方案2】：

您应该将return false 添加到您的onclick 处理程序中。这可以防止链接的默认行为。

更好的解决方案是使用 jQuery 或其他一些库并将事件附加到元素。它们还包含防止默认行为的特殊功能：

HTML：

<a id="button1" href="#"><img alt="alternate_text" src="imagesource" /></a>

Javascript/jQuery：

$('#button1').click(function(event) {
    $('div').hide();        // hides all divs
    $('#div1').show();      // shows the div with the id 'div1'
    event.preventDefault(); // prevents postback
});

【讨论】：

不错的信息，但是这家伙刚刚开始使用 javascript。我认为现在对他来说有点牵强:)
是的，他才刚刚开始，我认为最好从头学起；-)
Stefan，是的，这对我来说还是有点牵强。戴夫，我不想隐藏页面上的所有 div，只隐藏那些将其 css 类作为“内容”的 div。
要仅隐藏具有“内容”类的 div，您可以将第二行更改为 $('.content').hide()。 jQuery 是一个 JavaScript 库，如果禁用了 JavaScript，那么 jQuery 也将无法工作。优点是，您可以构建一个无需 JavaScript 即可工作的站点，然后通过 jQuery 注入客户端行为并改进站点。例如，您可以更改您的代码<a id="button1" href="#div1">...</a>，这将导致页面滚动到适当的 div，当 JavaScript 被禁用时。
这里是一个例子：jsfiddle.net/k2RQc（你可以删除 Javascript 来测试禁用 Javascript 的行为）

【解决方案3】：

总是，返回 false :)

但我宁愿把它放在函数中

function showdiv(divname)
{
   hideallcontentdivs();
   var targetdiv = document.getElementById(divname);
   targetdiv.style.display="block";
   return false;
}

【讨论】：

【解决方案4】：

+1 表示 Aristos 的答案，但如果您将 return false; 重构为 showdiv 函数的末尾，您必须更新所有链接。

【讨论】：

【解决方案5】：

return false 是关键，正如其他答案所说的那样。

只是为了补充我的观点：你真的不需要在这里使用锚点，恕我直言，这不是好的语义风格。只需使用 span 或 div，然后问题就消失了。

【讨论】：