如何避免javascript函数中的页面刷新？答案

【问题标题】：How to avoid page refresh in javascript function?如何避免javascript函数中的页面刷新？
【发布时间】：2011-12-31 06:29:47
【问题描述】：

我在使用asp.net 创建的网页中使用了javascript 函数。我在标签的点击事件上调用了该函数。但是在那个页面中，我已经处理了其他事件，并且当我执行任何事件时，每次我的页面都重新加载。当我点击标签时，我想执行 java 脚本函数。

我在我的html中调用了如下函数--

<a id="displayText" href="JavaScript:void(0)" onclick="javascript:toggle5('toggleText', 'displayText');">More</a>

我的javascript函数是--

function toggle5(showHideDiv, switchTag) {

           var ele = document.getElementById(showHideDiv);
           var imageEle = document.getElementById(switchTag);
           if (ele.style.display == "block") {
               ele.style.display = "none";
               imageEle.innerHTML = 'More'; //<img src="../images/more.JPG" style="height:18px;width:18px;border:none;">';
           }
           else {
               ele.style.display = "block";
               imageEle.innerHTML = 'Less'; //<img src="../images/less.JPG" style="height:18px;width:18px;border:none;">';
           }
   }

我正在使用上面的函数来隐藏下面的html标签---

<div id="toggleText" style="display:none;height:100%;width:100%;">
</div>

在点击事件中执行的代码--

protected void btnReset_Click(object sender, EventArgs e)
    {
        txtBrought.Text = "";
        txtCall.Text = "";
        txtNoCall.Text = "";
        txtNoSales.Text = "";
        txtSearchData.Text = "";
        ddlMD.SelectedIndex = 0;
        ddlCEO.SelectedIndex = 0;
        ddlCRM.SelectedIndex = 0;
        ddlRH.SelectedIndex = 0;
        chkBrought.Checked = false;
        chkCall.Checked = false;
        chkInSalesPlan.Checked = false;
        chkNoCall.Checked = false;
        chkNoSales.Checked = false;
        chkOSPending.Checked = false;
        chkOutSalesPlan.Checked = false;
        txtBrought.Enabled =false;
        txtCall.Enabled = false;
        txtNoCall.Enabled = false;
        txtNoSales.Enabled = false;
    }

我将不同的 asp.net 控件放置在我使用 javascript 函数隐藏的标签中。我使用了asp.net控件的事件。其中一个控件是 asp.net 按钮。

如何做到这一点？

【问题讨论】：

这里有一个演示或一些代码会很有用！
我们可以看看你的一些代码吗？
使用锚点时，应在 href 函数中返回 false 以防止页面重新加载
@Tom Knapen：我没听懂你。你能再解释一下吗？
能否请您放置调用 onclick 事件的代码？

标签： javascript asp.net html

【解决方案1】：

嗯，我不确定你的问题，但我有一个小费。我认为您的事件正在冒泡，因此它会触发默认事件，例如<a> 标签会执行的操作，即：刷新。所以你需要停止这种冒泡：

$('a').bind('click', function(e){

  e.stopPropagation();
  e.preventDefault();
  // CODE YOU WANNA DO

});

【讨论】：

如果你使用的是 jQuery 则有效
嗯，是的，在发布它的时候，这个问题根本不需要详细说明。我还是留下了这个，也许有人可以使用它。

【解决方案2】：

我尝试了上面的代码，但我没有刷新页面，它对我来说工作正常，

经过测试的浏览器：IE8、fireFox3

【讨论】：

你用过asp.net网站吗？
没有。我用纯 HTML 进行了测试。如果它作为纯 HTML 工作，那么它应该适用于所有 Web 技术，因为最终 HTML 内容正在被浏览器解析
我的脚本的问题是 .当我执行任何事件时，每次都会发生页面刷新，这就是它再次调用我的 javascript 函数的原因。我不想让这种情况发生。
要找出这一点，我需要浏览器获得的整个 HTML。如果有这个问题，请给我网址